- 제출된 URL:
- https://pudding.cool/2021/10/judge-my-music/
- 보고서 완료:
링크 · 7개 결과
페이지에서 식별된 외부 링크
| 링크 | 텍스트 |
|---|---|
| https://facebook.com/pudding.viz/ | |
| https://twitter.com/puddingviz/ | |
| https://www.instagram.com/the.pudding | |
| https://patreon.com/thepudding/ | PATREON |
| http://eepurl.com/czym6f | NEWSLETTER |
| https://www.spotify.com/account/apps/ | here |
| https://music-bot-pudding.herokuapp.com/applemusiclogout | here |
JavaScript 변수 · 11개 결과
페이지의 창 개체에 로드된 전역 JavaScript 변수는 함수 외부에서 선언된 변수로, 현재 범위 내에서 코드의 어느 부분에서나 액세스할 수 있습니다
| 이름 | 유형 |
|---|---|
| onbeforetoggle | object |
| documentPictureInPicture | object |
| onscrollend | object |
| MusicKit | object |
| core | object |
| __core-js_shared__ | object |
| d3 | object |
| HowlerGlobal | function |
| Howler | object |
| Howl | function |
콘솔 로그 메시지 · 0개 결과
웹 콘솔에 기록된 메시지
HTML
페이지의 원시 HTML 본문
<!DOCTYPE html><html lang="en" data-version="1732830026789"><head>
<title>How Bad Is Your Streaming Music?</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="description" content="Our sophisticated A.I. judges your awful taste in music.">
<meta name="news_keywords" content="music,spotify,data">
<meta property="og:title" content="How Bad Is Your Streaming Music?">
<meta property="og:site_name" content="The Pudding">
<meta property="og:url" content="https://pudding.cool/2021/10/judge-my-music/">
<meta property="og:description" content="Our sophisticated A.I. judges your awful taste in music.">
<meta property="og:type" content="article">
<meta property="og:locale" content="en_US">
<meta property="og:image" content="https://pudding.cool/2021/10/judge-my-music/assets/social/social-facebook.jpg">
<meta property="og:image:type" content="image/jpeg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="600">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="https://pudding.cool">
<meta name="twitter:creator" content="@matthew_daniels">
<meta name="twitter:title" content="How Bad Is Your Streaming Music?">
<meta name="twitter:description" content="Our sophisticated A.I. judges your awful taste in music.">
<meta name="twitter:image:src" content="https://pudding.cool/2021/10/judge-my-music/assets/social/social-twitter.jpg">
<meta name="robots" content="max-image-preview:large">
<link rel="canonical" href="https://pudding.cool/2021/10/judge-my-music/">
<link rel="apple-touch-icon" sizes="180x180" href="https://pudding.cool/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="https://pudding.cool/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="https://pudding.cool/favicon-16x16.png">
<link rel="manifest" href="https://pudding.cool/site.webmanifest">
<link rel="mask-icon" href="https://pudding.cool/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#ffc40d">
<meta name="theme-color" content="#ffffff">
<link rel="preload" type="font/woff2" as="font" crossorigin="" href="https://pudding.cool/assets/fonts/atlas/AtlasGrotesk-Regular-Web.woff2">
<!-- <link rel='preload' type='font/woff2' as='font' crossorigin href='https://pudding.cool/assets/fonts/atlas/AtlasGrotesk-Medium-Web.woff2'> -->
<!-- <link rel='preload' type='font/woff2' as='font' crossorigin href='https://pudding.cool/assets/fonts/atlas/AtlasGrotesk-Bold-Web.woff2'> -->
<link rel="preload" type="font/woff2" as="font" crossorigin="" href="assets/fonts/recoleta/recoleta.woff2">
<style>*{-webkit-box-sizing:border-box;box-sizing:border-box}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section{display:block}a img{border:none}blockquote{quotes:none}blockquote:before,blockquote:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}caption,th,td{text-align:left;font-weight:normal;vertical-align:middle}.xxx-small{font-size:10px;line-height:1.65}.xx-small{font-size:11px;line-height:1.65}.x-small{font-size:12px;line-height:1.65}.small{font-size:14px;line-height:1.65}.root{font-size:16px;line-height:1.65}.medium{font-size:18px;line-height:1.65}.large{font-size:20px;line-height:1.5}.x-large{font-size:24px;line-height:1.4}.xx-large{font-size:32px;line-height:1.4}.xxx-large{font-size:40px;line-height:1.4}.xxxx-large{font-size:48px;line-height:1.2}.xxxxx-large{font-size:64px;line-height:1.2}.hide-accessible{width:1px;height:1px;overflow:hidden;position:absolute}.hide-invisible{visibility:hidden}.hide-display{display:none}.skip-to-main{border:none;width:1px;height:1px;overflow:hidden;position:absolute}.skip-to-main:focus{width:auto;height:auto;background-color:#f4f4f4;padding:.5rem;z-index:1000}.prose{max-width:40rem;margin:0 auto;padding:0 1rem}.media-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkRDMDBGQ0Y5NEI4NjExRTM5RTg2QTY1RTUyQjIxNEQyIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkRDMDBGQ0ZBNEI4NjExRTM5RTg2QTY1RTUyQjIxNEQyIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6REMwMEZDRjc0Qjg2MTFFMzlFODZBNjVFNTJCMjE0RDIiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6REMwMEZDRjg0Qjg2MTFFMzlFODZBNjVFNTJCMjE0RDIiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6C0EmkAAAAGElEQVR42mJiYGD4DwQMTECCEchhAAgwAEcGBv9dngKPAAAAAElFTkSuQmCC")}#starter-guide{max-width:40rem;margin:0 auto}body{-webkit-font-feature-settings:'kern' 1,'onum' 0,'liga' 0,'tnum' 1;font-feature-settings:'kern' 1,'onum' 0,'liga' 0,'tnum' 1;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:rgba(0,0,0,0);background-color:#fff;color:#282828;font-weight:500;font-family:'Tiempos Text Web',Georgia,Times,serif;font-size:16px}@media only screen and (min-width:30em){body{font-size:18px}}h1{font-size:32px;line-height:1.4;margin-top:1.5rem}h2{font-size:24px;line-height:1.4;margin-top:1.5rem}h3{font-size:20px;line-height:1.5;margin-top:1.5rem}h4{font-size:18px;line-height:1.65;margin-top:1.5rem}h5{font-size:16px;line-height:1.65;margin-top:1.5rem}h6{font-size:14px;line-height:1.65;margin-top:1.5rem}p{margin:1.5rem 0;font-size:16px;line-height:1.65}@media only screen and (min-width:30em){p{font-size:18px;line-height:1.65}}a{text-decoration:none;border-bottom:1px solid #282828;color:#282828}a:visited,a:hover{color:#282828}strong,b{font-weight:700}em,i{font-style:italic}ul{list-style-type:none}li{font-size:16px}@media only screen and (min-width:30em){li{font-size:18px}}img,video{display:block;width:100%}button{cursor:pointer;border:none;outline:none;margin:0;padding:0;font-size:16px}@media only screen and (min-width:30em){button{font-size:18px}}sub,sup{font-size:.75rem;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}footer.pudding-footer{padding:3rem 1rem;font-family:'Atlas Grotesk Web';margin-top:3rem}footer.pudding-footer .footer-recirc{max-width:65rem;margin:0 auto}footer.pudding-footer .footer-recirc__articles{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;font-family:'Atlas Grotesk Web'}footer.pudding-footer .footer-recirc__article{display:block;width:100%;border:none;margin-bottom:2rem}@media only screen and (min-width:50em){footer.pudding-footer .footer-recirc__article{width:calc(25% - 1.5rem);margin-right:1.5rem}footer.pudding-footer .footer-recirc__article:last-of-type{margin-right:0}}footer.pudding-footer .footer-recirc .article__headline{font-family:'Atlas Grotesk Web';font-size:20px;line-height:1;font-weight:700;padding-left:.5rem;margin-top:1rem}footer.pudding-footer .footer-company{margin:0 auto;margin-top:3rem;max-width:65rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;font-family:'Atlas Grotesk Web'}@media only screen and (min-width:50em){footer.pudding-footer .footer-company{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}footer.pudding-footer .footer-company__cta{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1;margin:2rem 0 0 0;width:100%}@media only screen and (min-width:50em){footer.pudding-footer .footer-company__cta{width:22rem;margin:0 0 0 2rem}}footer.pudding-footer .footer-company__cta-list{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;height:12rem}@media only screen and (min-width:50em){footer.pudding-footer .footer-company__cta-list{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}}footer.pudding-footer .footer-company__cta-list li{display:-webkit-box;display:-ms-flexbox;display:flex;margin-bottom:1rem;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-family:'Atlas Grotesk Web'}@media only screen and (min-width:50em){footer.pudding-footer .footer-company__cta-list li{padding-left:1rem}}footer.pudding-footer .footer-company__cta-list li a{display:-webkit-box;display:-ms-flexbox;display:flex;border:none;font-family:'Atlas Grotesk Web'}footer.pudding-footer .footer-company__cta-list li p{font-family:'Atlas Grotesk Web';margin:0;padding-left:.5rem;padding-top:.1rem;font-size:.8rem;line-height:1;color:#949494}@media only screen and (min-width:40em){footer.pudding-footer .footer-company__cta-list li p{font-size:1rem}}footer.pudding-footer .footer-company__cta-list li svg{fill:#949494;stroke:none;vertical-align:middle}footer.pudding-footer .footer-company__cta-list li svg circle,footer.pudding-footer .footer-company__cta-list li svg polyline,footer.pudding-footer .footer-company__cta-list li svg line{fill:none;stroke:#949494}footer.pudding-footer .footer-company__cta-list li .feather-mail path,footer.pudding-footer .footer-company__cta-list li .feather-lock path,footer.pudding-footer .footer-company__cta-list li .feather-rss path{stroke:#949494;fill:none}footer.pudding-footer .footer-company__about{-webkit-box-ordinal-group:1;-ms-flex-order:0;order:0;width:100%;color:#949494;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}@media only screen and (min-width:50em){footer.pudding-footer .footer-company__about{width:calc(100% - 24rem)}}footer.pudding-footer .footer-company__about p{margin:0;font-size:16px;line-height:1.4}footer.pudding-footer .footer-company__about svg{width:12rem;margin-bottom:.5rem}header{z-index:1000;position:absolute;top:0;left:0;width:100%;background-color:#fff;font-family:'Atlas Grotesk Web',Helvetica,Arial,sans-serif}header a.logo{display:block;border:none;max-width:9rem;margin:1rem auto}header a.logo svg{fill:#282828;display:block;width:100%}header.is-sticky{position:fixed;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);background-color:#fff;-webkit-box-shadow:0 0 7px 1px #c9c9c9;box-shadow:0 0 7px 1px #c9c9c9;height:3rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}header.is-sticky a.logo{margin:0 auto}header.is-sticky .header__toggle{position:fixed;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);top:0;right:0;padding:.75rem;cursor:pointer;line-height:1;z-index:1000;border:none;background-color:transparent}header.is-sticky .header__toggle svg{stroke:#282828}header.is-sticky .header__toggle span:first-of-type{display:block}header.is-sticky .header__toggle span:last-of-type{display:none}header.is-sticky .header__toggle.is-visible span:first-of-type{display:none}header.is-sticky .header__toggle.is-visible span:last-of-type{display:block}header.is-sticky .header__toggle.is-visible span svg{stroke:#f4f4f4}header.is-sticky .header__menu{position:fixed;top:0;right:0;-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);height:100vh;width:100%;max-width:30rem;padding:1rem 1.5rem;background-color:#282828;color:#f4f4f4;z-index:1000;-webkit-transition:-webkit-transform 200ms ease-in-out;transition:-webkit-transform 200ms ease-in-out;transition:transform 200ms ease-in-out;transition:transform 200ms ease-in-out, -webkit-transform 200ms ease-in-out}@media only screen and (min-width:30em){header.is-sticky .header__menu{border-left:1px solid #5b5b5b}}header.is-sticky .header__menu.is-visible{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}header.is-sticky .header__menu a{color:#f4f4f4;border-bottom:1px solid #f4f4f4}header.is-sticky .header__menu a:hover{color:#c9c9c9}header.is-sticky .header__menu .menu__links{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}@media only screen and (min-width:40em){header.is-sticky .header__menu .menu__links{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}}header.is-sticky .header__menu .menu__links li{font-family:'National 2 Narrow Web',Helvetica,Arial,sans-serif;font-weight:700;text-transform:uppercase;margin-bottom:.5em;margin-right:.5em;font-size:20px}@media only screen and (min-width:30em){header.is-sticky .header__menu .menu__links li{font-size:24px}}header.is-sticky .header__menu a.patreon-link{font-family:'National 2 Narrow Web',Helvetica,Arial,sans-serif;font-weight:700;text-transform:uppercase;border:none;background-color:#f4f4f4;color:#282828;padding:.5em .75em}header.is-sticky .header__menu a.patreon-link:hover{opacity:.75}header.is-sticky .menu__patrons ul{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}header.is-sticky .menu__patrons li:after{display:inline;content:',';margin-right:.25em}header.is-sticky .menu__patrons li:last-of-type:after{content:'.'}header.is-sticky.is-dark{background-color:#282828;-webkit-box-shadow:0 0 7px 1px #5b5b5b;box-shadow:0 0 7px 1px #5b5b5b}header.is-sticky.is-dark svg path{fill:#f4f4f4}header.is-sticky.is-dark .header__menu{background-color:#fff;color:#282828}@media only screen and (min-width:30em){header.is-sticky.is-dark .header__menu{border-left:1px solid #c9c9c9}}header.is-sticky.is-dark a{color:#282828;border-bottom:1px solid #282828}header.is-sticky.is-dark a:hover{color:#5b5b5b}header.is-sticky.is-dark .header__toggle svg{stroke:#f4f4f4}header.is-sticky.is-dark .header__toggle.is-visible span svg{stroke:#282828}.intro{margin:0 auto;max-width:100%;position:relative}.intro__hed{max-width:60rem;margin:0 auto;text-align:center}.intro__dek{max-width:40rem;margin:0 auto;margin-top:1rem;text-align:center}.intro__byline{max-width:40rem;margin:0 auto;margin-top:1rem;text-align:center}.intro__time{display:block;max-width:40rem;margin:0 auto;margin-top:1rem;text-align:center}@import url("https://fonts.googleapis.com/css2?family=Inconsolata:wght@500&display=swap");
html,body,main{height:100%}.intro{height:100%}.ti-cursor{color:#aaa !important;margin-left:0 !important}#loader{width:50px;fill:#fff;margin-left:-4px}.fantano{width:80px;margin:0 auto;margin:0 30px}.pitchfork{width:150px;margin:0 30px}.pigeons{width:122px;margin:0 30px}.stereo{width:127px;margin:0 30px}.tiny{width:97px;margin:0 30px}.vegan{width:159px;margin:0 30px}.thirty{width:108px;margin:0 30px}.ascii-art{font-family:monospace;height:0;overflow:hidden;display:none;margin:0 auto;margin-top:1rem;width:calc(100% - 40px);max-width:500px;margin-bottom:10rem}.ascii-art pre{font-family:monospace;white-space:pre;font-size:calc(min(3.3vw, 19px))}.score-slide{z-index:100000;position:relative}.score-slide .score-chat{width:calc(100% - 50px);max-width:600px;text-align:left;margin:0 auto}.score-slide .score-chat .score-chat-special{position:relative}.score-slide .score-chat .score-chat-special .special-score{font-size:3rem;font-weight:900;line-height:1.2;position:relative;top:0;left:0;margin:0;width:100%;margin-bottom:2rem}@media (max-width:450px){.score-slide .score-chat .score-chat-special .special-score{font-size:2rem}}.score-slide .score-chat p,.score-slide .score-chat a,.score-slide .score-chat li{font-size:1.1rem;margin-top:.6rem;font-family:'Inconsolata',monospace;font-weight:500}.score-slide .score-chat .report form{display:-webkit-box;display:-ms-flexbox;display:flex;margin-top:1rem;margin-bottom:1rem}.score-slide .score-chat .report input{background:rgba(255,255,255,0.53);border:1px solid rgba(0,0,0,0.25);border-radius:3px;margin-right:5px;padding-left:.5rem;font-family:'Atlas Grotesk Web';-webkit-appearance:none;-moz-appearance:none;font-size:14px}.score-slide .score-chat .report .btn{font-family:'Atlas Grotesk Web';background:#5977e1;border-radius:3px;border:none;-webkit-box-shadow:0 1px 2px rgba(15,15,15,0.15);box-shadow:0 1px 2px rgba(15,15,15,0.15);border:1px solid #4365be;padding:.5rem 1rem;color:#fff}.score-slide .score-chat .report button{font-family:'Atlas Grotesk Web';background:#e16259;border-radius:3px;border:none;-webkit-box-shadow:0 2px 2px rgba(225,98,89,0.36);box-shadow:0 2px 2px rgba(225,98,89,0.36);border:1px solid #be5643;padding:.5rem 1rem;color:#fff;margin-top:1rem;margin-bottom:1rem}.score-slide .score-chat .report p,.score-slide .score-chat .report li{font-family:'Inconsolata',monospace;text-align:left;padding:0;font-weight:400}.score-slide .score-chat .report .bold{font-weight:600}.score-slide .score-chat .report .extra-score{padding-left:2rem}.score-slide .score-chat .report .top-margin{margin-top:2rem}.score-slide .score-chat .report ul li{list-style-type:disc;margin-left:2rem;line-height:1.6;margin-top:.4rem}.ai-building-slide{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.ai-building-slide .progress-bar .bar{padding-left:15px}.ai-building-slide .ai-building-slide-title{font-family:'Inconsolata',monospace;font-weight:500;text-align:left;width:calc(100% - 50px);max-width:450px;margin:0 auto}.ai-building-slide .ai-building-slide-title p{font-size:1.1rem;margin-top:15px;line-height:1.2;font-family:'Inconsolata',monospace;font-weight:500}p,a{margin:0;font-weight:300}.score-section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-family:'Atlas Grotesk Web';padding:.3rem .8rem;position:absolute;width:100%;background:linear-gradient(180deg,#f7fdff 20px,rgba(255,255,255,0) 100%);bottom:154px;padding:0;background:none;z-index:1000;visibility:hidden}.score-section .score-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;padding:.3rem .8rem}.score-section .score-text{margin-left:0}.score-section .score-text span{font-weight:400}.score-section .score-num{margin-left:5px}.score-section p{text-align:center;font-size:.8rem;color:rgba(29,55,64,0.72);font-family:'Atlas Grotesk Web'}.chat-section{height:calc(100% - 150px);overflow:scroll;width:100%;min-height:350px;margin:0 auto;height:100%}.chat-section .chat-wrapper{width:calc(100% - 40px);max-width:500px;margin:0 auto;padding-bottom:250px}.chat-section .chat-wrapper .first-row{margin-top:5rem}.chat-section .play-row{background:#e9e9e9;padding:5px;border-radius:15px;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.chat-section .play-row .time-stamp{font-size:12px;-ms-flex-item-align:center;align-self:center;font-family:'Atlas Grotesk Web',Helvetica,Arial,sans-serif;margin:0;padding:0;padding-right:5px}.chat-section .play-row .waveform{height:25px}.chat-section .play-row .waveform svg{width:81px;height:25px}.chat-section .play-row .play-button{stroke-width:1px;height:25px;cursor:pointer}.chat-section .play-row .play-button svg{width:25px;height:100%;position:relative}.chat-section .play-row .play-button svg circle,.chat-section .play-row .play-button svg line{stroke-width:1.5px;stroke:#007aff}.chat-section .play-row .play-button svg line{stroke-width:2.5px}.chat-section .play-row .play-button svg polygon{fill:#007aff;stroke-width:1px;stroke:#007aff}.chat-section p,.chat-section a{margin-bottom:1.1rem;font-size:1.1rem;font-family:'Inconsolata',monospace;line-height:1.3;width:calc(100% - 50px);margin-left:10px}.chat-section p span,.chat-section a span{display:inline-block}.chat-section p span svg,.chat-section a span svg{vertical-align:middle}.chat-section p span .spotify-logo,.chat-section a span .spotify-logo{width:15px;margin-top:-3px}.chat-section p span .apple-logo,.chat-section a span .apple-logo{width:58px;margin-top:-5px;margin-right:2px}.chat-section .row-image{margin-bottom:.5rem;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.chat-section .row-image span{background:#e9e9e9;padding:1rem 1rem;border-radius:15px}.chat-section .row-image .art{max-width:50px;-ms-flex-item-align:center;align-self:center;display:block}.chat-section .align-right{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;margin-top:1rem}.chat-section .align-right a{font-family:'Atlas Grotesk Web'}.chat-section .align-right p span{float:right;border:1px solid #afa4a4;font-family:'Atlas Grotesk Web';font-size:1rem;min-width:100px;text-align:center;padding:.5rem 1rem;border-radius:25px;border-radius:10px;-webkit-box-shadow:0 4px 5px rgba(0,0,0,0.1);box-shadow:0 4px 5px rgba(0,0,0,0.1);-webkit-box-shadow:0 16px 32px 0 rgba(102,138,165,0.4);box-shadow:0 16px 32px 0 rgba(102,138,165,0.4)}.chat-section .align-right p span a{font-size:1rem}.chat-section .options{-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.chat-section .options p,.chat-section .options a{border:none;text-decoration:none;width:100%;font-size:1.1rem;margin-bottom:.7rem}.chat-section .options p:last-of-type,.chat-section .options a:last-of-type{margin-right:0}.chat-section .options p span,.chat-section .options a span{cursor:pointer;background:#fff;border:none}.chat-section .options p .selected-option,.chat-section .options a .selected-option{background-color:#007aff;background-color:rgba(15,92,121,0.13);color:#282828;-webkit-box-shadow:none;box-shadow:none;cursor:initial;pointer-events:none}.chat-section .fmk{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;margin-bottom:1rem;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.chat-section .fmk .col{margin-left:1rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.chat-section .fmk .col .artist-name{text-align:center;font-size:.8rem;margin:0;width:100%;margin-top:5px;font-family:'Atlas Grotesk Web';margin-bottom:10px}.chat-section .fmk .col .fmk-options{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.chat-section .fmk .col .fmk-options .fmk-option{text-align:center;margin:0;width:auto;font-family:'Atlas Grotesk Web'}.chat-section .fmk .col .fmk-options .fmk-option span{cursor:pointer;min-width:auto}.chat-section .fmk .col .fmk-options .fmk-option .fmk-option-active{background:#aaa}.chat-section .fmk .col .fmk-options-wide{-ms-flex-wrap:wrap;flex-wrap:wrap;display:block}.chat-section .fmk .col .fmk-options-wide .fmk-option-wide{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin-bottom:5px;display:-webkit-box;display:-ms-flexbox;display:flex;width:100%}.chat-section .fmk .col .fmk-options-wide .fmk-option-wide span{display:block;margin:0 auto}.chat-section .fmk img{max-width:100px;width:100px;height:100px;-ms-flex-item-align:center;align-self:center;-o-object-fit:cover;object-fit:cover}@media (max-width:375px){.chat-section .fmk img{width:75px;height:75px}}.label{font-size:18px;font-weight:600}.cover-wrapper,.cover-score{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);height:100%;position:fixed;z-index:100000;pointer-events:none}.cover-wrapper .cover,.cover-score .cover{margin-right:50px;-ms-flex-item-align:end;align-self:flex-end;margin-bottom:26px;position:relative}.cover-wrapper .cover:after,.cover-score .cover:after{background:url("assets/images/shelf-2.png");content:'';position:absolute;display:none;left:50%;width:300%;height:300%;top:0;-webkit-transform:translate(-50%,-41px);-ms-transform:translate(-50%,-41px);transform:translate(-50%,-41px);z-index:-1;background-size:contain;background-repeat:no-repeat}.cover-wrapper .cover .cover-img,.cover-score .cover .cover-img{-webkit-transform:perspective(1090px) rotateX(10deg);transform:perspective(1090px) rotateX(10deg);z-index:-1;width:100%;height:100%}.cover-wrapper .cover .cover-img img,.cover-score .cover .cover-img img{-webkit-filter:saturate(0.9);filter:saturate(0.9)}.cover-wrapper .cover .cover-img .img-fake,.cover-score .cover .cover-img .img-fake{position:absolute;z-index:-1;top:0;left:0;width:calc(100% + 2px);-webkit-transform:translate(-1px,0) scaleY(.99);-ms-transform:translate(-1px,0) scaleY(.99);transform:translate(-1px,0) scaleY(.99);-webkit-filter:brightness(.94) blur(.2px) saturate(0.9);filter:brightness(.94) blur(.2px) saturate(0.9)}.cover-wrapper .cover .cover-img .plastic,.cover-score .cover .cover-img .plastic{position:absolute;top:0;left:0;content:'';width:calc(100% + 2px);height:calc(100% - 1px);background:url("assets/images/plastic-small.jpg");background-size:contain;mix-blend-mode:screen;opacity:1;z-index:100000;mix-blend-mode:difference;opacity:.3}.cover-wrapper .cover .shelf,.cover-score .cover .shelf{background:url("assets/images/shelf-3.png");width:155px;height:10px;background-size:contain;background-repeat:no-repeat;height:17px;position:absolute;bottom:0;-webkit-transform:translate(-8px,11px);-ms-transform:translate(-8px,11px);transform:translate(-8px,11px);z-index:100;-webkit-transform:translate(calc((100% + 15px) * -0.0516129032),calc(65%));-ms-transform:translate(calc((100% + 15px) * -0.0516129032),calc(65%));transform:translate(calc((100% + 15px) * -0.0516129032),calc(65%));height:calc((100% + 15px) * 0.109677419);width:calc(100% + 15px)}.cover-wrapper .cover .shelf:after,.cover-score .cover .shelf:after{content:'';background:linear-gradient(120deg,rgba(255,255,255,0) 42%,rgba(0,0,0,0.15) 45%,rgba(0,0,0,0.35) 65%),linear-gradient(20deg,rgba(255,255,255,0) 38%,rgba(0,0,0,0.25) 45%,rgba(0,0,0,0.23) 55%,rgba(0,0,0,0.13) 75%),radial-gradient(ellipse at 50% 100%,rgba(0,0,0,0.15) 3%,rgba(255,255,255,0) 40%);width:100%;height:100%;background-repeat:no-repeat;position:absolute;bottom:9px;left:0;-webkit-transform:translate(0,100%) scaleY(-.5) scaleX(.85);-ms-transform:translate(0,100%) scaleY(-.5) scaleX(.85);transform:translate(0,100%) scaleY(-.5) scaleX(.85);background:rgba(0,0,0,0.5);-webkit-filter:blur(6px);filter:blur(6px)}.cover-wrapper .cover .shelf-shadow,.cover-score .cover .shelf-shadow{width:151px;height:13px;position:absolute;right:0;margin:0 auto;left:0;bottom:-1px;z-index:-1;-webkit-transform:translate(-6px,0);-ms-transform:translate(-6px,0);transform:translate(-6px,0);display:none}.cover-wrapper .cover img,.cover-score .cover img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.cover-score-wrapper{max-width:100%;width:100%;overflow:hidden;position:absolute;pointer-events:none;top:0;left:0;height:250px}.cover-score{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;height:150px;top:15px;position:absolute;left:-35px}.data-output{position:absolute;bottom:0;height:160px;width:100%;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;overflow:hidden;background:-webkit-gradient(linear,left top, left bottom,from(rgba(255,255,255,0.1)),color-stop(10%, #f7fdff),to(#f7f1f1));background:linear-gradient(180deg,rgba(255,255,255,0.1) 0%,#f7fdff 10%,#f7f1f1 100%)}.data-output .data-label{font-weight:600;color:#000;margin-top:1.5rem}.data-output p{color:#999;text-align:right;font-size:14px}.login-slide{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}@media (max-width:450px){.login-slide{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}}.login-slide .bylines{padding-left:1rem;padding-right:1rem;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:.5rem;position:absolute;bottom:0;width:100%;left:0;right:0;z-index:100000000}.login-slide .bylines .privacy-names .names{font-family:'Inconsolata',monospace;-ms-flex-item-align:center;align-self:center;font-size:.95rem}@media (max-width:900px){.login-slide .bylines .privacy-names .names{line-height:1.2;text-align:right;max-width:400px}}@media (max-width:750px){.login-slide .bylines .privacy-names .names{max-width:320px}}@media (max-width:350px){.login-slide .bylines .privacy-names .names{font-size:.85rem}}.login-slide .bylines .privacy-names .privacy-q{font-family:'Inconsolata',monospace;font-size:.95rem;-ms-flex-item-align:center;align-self:center;line-height:1.2}.login-slide .bylines .privacy-names .privacy-q a{cursor:pointer}@media (max-width:450px){.login-slide .bylines .privacy-names .privacy-q{text-align:right;margin-top:10px;font-size:.9rem}}@media (max-width:370px){.login-slide .bylines .privacy-names .privacy-q{font-size:.85rem}}.login-slide .bylines .logo{font-family:'Recoleta-Regular',sans-serif;display:-webkit-box;display:-ms-flexbox;display:flex}@media (max-width:750px){.login-slide .bylines .logo{display:block;margin-right:10px;-ms-flex-item-align:end;align-self:flex-end}}.login-slide .bylines .logo span{-ms-flex-item-align:center;align-self:center;margin-right:10px}@media (max-width:750px){.login-slide .bylines .logo span{line-height:1.3;text-align:left;margin-right:10px;font-size:14px;display:block}}.login-slide .bylines .logo a{border:none;font-size:1.8rem;display:-webkit-box;display:-ms-flexbox;display:flex}@media (max-width:750px){.login-slide .bylines .logo a{line-height:1;text-align:left;margin-right:10px}}.login-slide .bylines .logo a #wordmark{width:135px;height:36px;vertical-align:center}@media (max-width:370px){.login-slide .bylines .logo a #wordmark{width:125px}}.login-slide .bg-shelf-wrapper{position:relative;width:100%;max-height:400px;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;padding-bottom:1.5rem}@media (max-width:450px){.login-slide .bg-shelf-wrapper{padding-bottom:6.5rem}}.login-slide .bg-shelf-wrapper .bg-shelf{background:url("assets/images/shelf-9.png");width:100%;height:100%;background-size:contain;background-repeat:no-repeat;position:absolute;background-position:50% 50%;z-index:1000000;left:0;right:0;top:50%;-webkit-transform:translate(0,-50%);-ms-transform:translate(0,-50%);transform:translate(0,-50%);margin:0 auto;max-width:1000px;max-height:340px}@media (max-width:450px){.login-slide .bg-shelf-wrapper .bg-shelf{background-size:cover;background-position:10% 100%;max-height:200px}}@media (max-width:350px){.login-slide .bg-shelf-wrapper .bg-shelf{max-height:200px;top:0;-webkit-transform:translate(0,0);-ms-transform:translate(0,0);transform:translate(0,0)}}@media (max-height:350px){.login-slide .bg-shelf-wrapper .bg-shelf{max-height:200px;top:0;-webkit-transform:translate(0,0);-ms-transform:translate(0,0);transform:translate(0,0)}}.login-slide .bg-shelf-wrapper .bg-shelf img{height:100%;min-width:1000px;-o-object-fit:cover;object-fit:cover;display:none}@media (max-width:375px) and (max-height:620px){.login-slide .bg-shelf-wrapper .bg-shelf{top:0;-webkit-transform:translate(0,0);-ms-transform:translate(0,0);transform:translate(0,0)}}.login-slide .bg-shelf-wrapper .gray-gradient{height:100vh;width:100%;background:-webkit-gradient(linear,left top, left bottom,from(0),color-stop(60%, #f4f4f4),color-stop(70%, rgba(248,253,255,0)));background:linear-gradient(0,#f4f4f4 60%,rgba(248,253,255,0) 70%);position:absolute;bottom:0;left:0;right:0;margin:0 auto;z-index:-1}.login-slide .hed{font-family:'Recoleta-Regular';text-align:center;font-size:4rem;line-height:1.2;margin:0 auto;margin-bottom:2rem;max-width:700px;width:calc(100% - 40px);margin-top:1rem}@media (max-width:1000px){.login-slide .hed{font-size:3.6rem;max-width:600px;margin-bottom:1rem}}@media (max-width:500px){.login-slide .hed{font-size:2.8rem;margin-top:2rem;margin-bottom:1rem}}@media (max-width:400px){.login-slide .hed{font-size:2.2rem;margin-top:2rem}}.login-slide .dek{font-family:'Inconsolata',monospace;text-align:center;line-height:1.3;max-width:400px;width:calc(100% - 40px);font-size:1.4rem;margin:0 auto;margin-bottom:.5rem}@media (max-width:500px){.login-slide .dek{font-size:1.4rem;margin-top:1rem;line-height:1.3}}@media (max-width:400px){.login-slide .dek{font-size:1.1rem;margin-top:1rem}}.login-slide .updated-date{font-family:'Inconsolata',monospace;text-transform:uppercase;text-align:center;line-height:1.3;max-width:400px;width:calc(100% - 40px);font-size:.95rem;margin:0 auto;margin-bottom:1rem;color:#e50ee5}@media (max-width:500px){.login-slide .updated-date{font-size:.95rem;margin-top:1rem;line-height:1.3}}@media (max-width:400px){.login-slide .updated-date{font-size:.95rem;margin-top:1rem}}.login-slide .logging-in{margin:0 auto;font-family:'Recoleta-Regular';text-align:center;position:relative;z-index:10000000000}.login-slide .logging-in .button-main{padding:.7rem 1.5rem;background:#000;-webkit-box-shadow:0 8px 32px 0 rgba(0,0,0,0.35);box-shadow:0 8px 32px 0 rgba(0,0,0,0.35);border-radius:10px;font-weight:500;color:#fff;font-family:'Recoleta-Regular';margin:1rem;font-size:1.3rem}.login-slide .logging-in .button-sub{font-size:1rem;margin-bottom:1rem}.login-slide .logging-in a{margin:0 auto;background:#c8c8c8;padding:.5rem 1rem;text-align:center;border:none;border-radius:25px;font-family:'Recoleta-Regular'}.loading-slide{height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.loading-section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;height:50%;font-family:'Atlas Grotesk Web';width:calc(100% - 100px);overflow:scroll;position:absolute;top:50%;left:100px;-webkit-transform:translate(0,-50%);-ms-transform:translate(0,-50%);transform:translate(0,-50%)}.swiper-container{width:100%;height:100%}.swiper-container .swiper-slide{height:100%}.results{display:none}.wrapper{margin-bottom:2rem}.wrapper .column-label{font-weight:500}.wrapper .artists,.wrapper .tracks{display:-webkit-box;display:-ms-flexbox;display:flex}.wrapper .artists p,.wrapper .tracks p{font-size:14px;line-height:1.2;margin-bottom:.5rem}.wrapper .tracks p span{display:block;font-size:12px;margin-top:2px}#loader circle:nth-of-type(1){opacity:.5;animation:fade .7s cubic-bezier(.39,.58,.57,1) 0s infinite alternate-reverse}#loader circle:nth-of-type(2){opacity:.5;animation:fade .7s cubic-bezier(.39,.58,.57,1) .4s infinite alternate-reverse}#loader circle:nth-of-type(3){opacity:.5;animation:fade .7s cubic-bezier(.39,.58,.57,1) .8s infinite alternate-reverse}#loader circle:nth-of-type(4){-webkit-animation:expandBigger .5s infinite alternate .4s;animation:expandBigger .5s infinite alternate .4s}#loader circle:nth-of-type(5){-webkit-animation:expandTiny .5s infinite alternate;animation:expandTiny .5s infinite alternate}#loader path{-webkit-animation:expandBiggest 1s linear infinite alternate;animation:expandBiggest 1s linear infinite alternate}.swiper-container-2{height:50vh}.swiper-container-2 .swiper-slide{width:auto;padding-top:3rem;height:100px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;opacity:0}.swiper-container .score-slide{font-family:'Atlas Grotesk Web';overflow:scroll}.gradient-wrapper{position:fixed;pointer-events:none;z-index:0;top:0;left:0;width:100vw;height:100%}.gradient-wrapper .gradient-overlay{height:100%;width:100%;-webkit-backdrop-filter:saturate(200%) blur(20px);backdrop-filter:saturate(200%) blur(20px);background-color:rgba(255,255,255,0.97);z-index:10000}.gradient-wrapper .gradient{height:100%;width:100%;position:absolute;top:0;left:0;z-index:-1}.gradient-wrapper .gradient svg{height:100%;width:100%;z-index:-1;position:relative}footer{display:none}.data-modal{width:100%;height:100%;display:none;background:#fff;z-index:10000000000;position:fixed;top:0;left:0}.data-modal .data-modal-container{max-width:550px;margin:0 auto;width:calc(100% - 40px);margin-top:2rem}.data-modal .data-modal-container button{padding:.5rem 1rem;border-radius:4px;margin-bottom:1rem;background:#000;color:#fff}.data-modal .data-modal-container p{font-family:'Atlas Grotesk Web';margin-bottom:1rem;font-size:1rem}@media (max-width:376px){.data-modal .data-modal-container p{font-size:14px}}@media (max-width:350px){.data-modal .data-modal-container p{font-size:12px}}.visible{display:block}@-webkit-keyframes fade{from{opacity:1}to{opacity:.7}}@keyframes fade{from{opacity:1}to{opacity:.7}}@-webkit-keyframes expandTiny{from{-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:translate(4.1px,-7.48px) scale(1.1);transform:translate(4.1px,-7.48px) scale(1.1)}}@keyframes expandTiny{from{-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:translate(4.1px,-7.48px) scale(1.1);transform:translate(4.1px,-7.48px) scale(1.1)}}@-webkit-keyframes expandBigger{from{-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:translate(2.52px,-6.26px) scale(1.1);transform:translate(2.52px,-6.26px) scale(1.1)}}@keyframes expandBigger{from{-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:translate(2.52px,-6.26px) scale(1.1);transform:translate(2.52px,-6.26px) scale(1.1)}}@-webkit-keyframes expandBiggest{from{-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:translate(-.525px,-.9487500191px) scale(1.025);transform:translate(-.525px,-.9487500191px) scale(1.025)}}@keyframes expandBiggest{from{-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:translate(-.525px,-.9487500191px) scale(1.025);transform:translate(-.525px,-.9487500191px) scale(1.025)}}@font-face{font-family:'swiper-icons';src:url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format('woff');font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}.swiper-container{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style-type:none;margin:0;padding:0;padding:0;z-index:1}.swiper-container-vertical > .swiper-wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform, -webkit-transform;-webkit-box-sizing:content-box;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.swiper-container-multirow > .swiper-wrapper{-ms-flex-wrap:wrap;flex-wrap:wrap}.swiper-container-multirow-column > .swiper-wrapper{-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.swiper-container-free-mode > .swiper-wrapper{-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto}.swiper-slide{-ms-flex-negative:0;flex-shrink:0;width:100%;height:100%;position:relative;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform, -webkit-transform}.swiper-slide-invisible-blank{visibility:hidden}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;-webkit-transition-property:height,-webkit-transform;transition-property:height,-webkit-transform;transition-property:transform,height;transition-property:transform,height,-webkit-transform}.swiper-container-3d{-webkit-perspective:1200px;perspective:1200px}.swiper-container-3d .swiper-wrapper,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-cube-shadow{-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-slide-shadow-bottom{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:-webkit-gradient(linear,right top, left top,from(rgba(0,0,0,0.5)),to(rgba(0,0,0,0)));background-image:linear-gradient(to left,rgba(0,0,0,0.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-right{background-image:-webkit-gradient(linear,left top, right top,from(rgba(0,0,0,0.5)),to(rgba(0,0,0,0)));background-image:linear-gradient(to right,rgba(0,0,0,0.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-top{background-image:-webkit-gradient(linear,left bottom, left top,from(rgba(0,0,0,0.5)),to(rgba(0,0,0,0)));background-image:linear-gradient(to top,rgba(0,0,0,0.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:-webkit-gradient(linear,left top, left bottom,from(rgba(0,0,0,0.5)),to(rgba(0,0,0,0)));background-image:linear-gradient(to bottom,rgba(0,0,0,0.5),rgba(0,0,0,0))}.swiper-container-css-mode > .swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar{display:none}.swiper-container-css-mode > .swiper-wrapper > .swiper-slide{scroll-snap-align:start start}.swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper{-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory}.swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper{-ms-scroll-snap-type:y mandatory;scroll-snap-type:y mandatory}:root{--swiper-navigation-size:44px}.swiper-button-prev,.swiper-button-next{position:absolute;top:50%;width:calc(var(--swiper-navigation-size) / 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(-1 * var(--swiper-navigation-size) / 2);z-index:10;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-prev.swiper-button-disabled,.swiper-button-next.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-prev:after,.swiper-button-next:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none !important;letter-spacing:0;text-transform:none;font-variant:initial;line-height:1}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{left:10px;right:auto}.swiper-button-prev:after,.swiper-container-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-container-rtl .swiper-button-prev{right:10px;left:auto}.swiper-button-next:after,.swiper-container-rtl .swiper-button-prev:after{content:'next'}.swiper-button-prev.swiper-button-white,.swiper-button-next.swiper-button-white{--swiper-navigation-color:#fff}.swiper-button-prev.swiper-button-black,.swiper-button-next.swiper-button-black{--swiper-navigation-color:#000}.swiper-button-lock{display:none}.swiper-pagination{position:absolute;text-align:center;-webkit-transition:300ms opacity;transition:300ms opacity;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-fraction,.swiper-pagination-custom,.swiper-container-horizontal > .swiper-pagination-bullets{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;-webkit-box-shadow:none;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet-active{opacity:1;background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-container-vertical > .swiper-pagination-bullets{right:10px;top:50%;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block}.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);width:8px}.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;-webkit-transition:200ms top,200ms -webkit-transform;transition:200ms top,200ms -webkit-transform;transition:200ms transform,200ms top;transition:200ms transform,200ms top,200ms -webkit-transform}.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);white-space:nowrap}.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:200ms left,200ms -webkit-transform;transition:200ms left,200ms -webkit-transform;transition:200ms transform,200ms left;transition:200ms transform,200ms left,200ms -webkit-transform}.swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:200ms right,200ms -webkit-transform;transition:200ms right,200ms -webkit-transform;transition:200ms transform,200ms right;transition:200ms transform,200ms right,200ms -webkit-transform}.swiper-pagination-progressbar{background:rgba(0,0,0,0.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;-ms-transform-origin:left top;transform-origin:left top}.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{-webkit-transform-origin:right top;-ms-transform-origin:right top;transform-origin:right top}.swiper-container-horizontal > .swiper-pagination-progressbar,.swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}.swiper-container-vertical > .swiper-pagination-progressbar,.swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:4px;height:100%;left:0;top:0}.swiper-pagination-white{--swiper-pagination-color:#fff}.swiper-pagination-black{--swiper-pagination-color:#000}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,0.1)}.swiper-container-horizontal > .swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical > .swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,0.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;text-align:center}.swiper-zoom-container > img,.swiper-zoom-container > svg,.swiper-zoom-container > canvas{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain}.swiper-slide-zoomed{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;-webkit-transform-origin:50%;-ms-transform-origin:50%;transform-origin:50%;-webkit-animation:swiper-preloader-spin 1s infinite linear;animation:swiper-preloader-spin 1s infinite linear;-webkit-box-sizing:border-box;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-container-fade.swiper-container-free-mode .swiper-slide{-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;-webkit-transition-property:opacity;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube{overflow:visible}.swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube.swiper-container-rtl .swiper-slide{-webkit-transform-origin:100% 0;-ms-transform-origin:100% 0;transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-prev,.swiper-container-cube .swiper-slide-next + .swiper-slide{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-slide-shadow-top,.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0;width:100%;height:100%;background:#000;opacity:.6;-webkit-filter:blur(50px);filter:blur(50px);z-index:0}.swiper-container-flip{overflow:visible}.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-flip .swiper-slide-shadow-top,.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}@-webkit-keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}</style>
<style>
/*
This font software is the property of Commercial Type.
You may not modify the font software, use it on another website, or install it on a computer.
License information is available at http://commercialtype.com/eula
For more information please visit Commercial Type at http://commercialtype.com or email us at info[at]commercialtype.com
Copyright (C) 2017 Schwartzco Inc.
License: 1704-GNCLGK
*/
/*
********************
National
********************
@font-face {
font-family: 'National 2 Web';
src: url('https://pudding.cool/assets/fonts/national/National2Web-Regular.woff2') format('woff2'),
url('https://pudding.cool/assets/fonts/national/National2Web-Regular.woff') format('woff');
font-weight: 500;
font-style: normal;
font-stretch: normal;
font-display: swap;
}
@font-face {
font-family: 'National 2 Web';
src: url('https://pudding.cool/assets/fonts/national/National2Web-Bold.woff2') format('woff2'),
url('https://pudding.cool/assets/fonts/national/National2Web-Bold.woff') format('woff');
font-weight: 700;
font-style: normal;
font-stretch: normal;
font-display: swap;
}
/*
********************
National Narrow
********************
*/
/*
@font-face {
font-family: 'National 2 Narrow Web';
src: url('https://pudding.cool/assets/fonts/national/National2NarrowWeb-Extralight.woff2') format('woff2'),
url('https://pudding.cool/assets/fonts/national/National2NarrowWeb-Extralight.woff') format('woff');
font-weight: 200;
font-style: normal;
font-stretch: normal;
font-display: swap;
}
@font-face {
font-family: 'National 2 Narrow Web';
src: url('https://pudding.cool/assets/fonts/national/National2NarrowWeb-Regular.woff2') format('woff2'),
url('https://pudding.cool/assets/fonts/national/National2NarrowWeb-Regular.woff') format('woff');
font-weight: 500;
font-style: normal;
font-stretch: normal;
font-display: swap;
}
@font-face {
font-family: 'National 2 Narrow Web';
src: url('https://pudding.cool/assets/fonts/national/National2NarrowWeb-Bold.woff2') format('woff2'),
url('https://pudding.cool/assets/fonts/national/National2NarrowWeb-Bold.woff') format('woff');
font-weight: 700;
font-style: normal;
font-stretch: normal;
font-display: swap;
}
/*
@font-face {
font-family: 'National 2 Narrow Web';
src: url('https://pudding.cool/assets/fonts/national/National2NarrowWeb-Black.woff2') format('woff2'),
url('https://pudding.cool/assets/fonts/national/National2NarrowWeb-Black.woff') format('woff');
font-weight: 900;
font-style: normal;
font-stretch: normal;
font-display: swap;
}
*/
/*
********************
Tiempos Text
********************
@font-face {
font-family: 'Tiempos Text Web';
src: url('https://pudding.cool/assets/fonts/tiempos/TiemposTextWeb-Regular.woff2') format('woff2'),
url('https://pudding.cool/assets/fonts/tiempos/TiemposTextWeb-Regular.woff') format('woff');
font-weight: 500;
font-style: normal;
font-stretch: normal;
font-display: swap;
}
@font-face {
font-family: 'Tiempos Text Web';
src: url('https://pudding.cool/assets/fonts/tiempos/TiemposTextWeb-Bold.woff2') format('woff2'),
url('https://pudding.cool/assets/fonts/tiempos/TiemposTextWeb-Bold.woff') format('woff');
font-weight: 700;
font-style: normal;
font-stretch: normal;
font-display: swap;
}
/*
********************
Tiempos Headline
********************
*/
/*
@font-face {
font-family: 'Tiempos Headline Web';
src: url('https://pudding.cool/assets/fonts/tiempos/TiemposHeadlineWeb-Regular.woff2') format('woff2'),
url('https://pudding.cool/assets/fonts/tiempos/TiemposHeadlineWeb-Regular.woff') format('woff');
font-weight: 500;
font-style: normal;
font-stretch: normal;
font-display: swap;
}
*/
/*
********************
Publico Text
********************
*/
/*
@font-face {
font-family: 'Publico Text Web';
src: url('https://pudding.cool/assets/fonts/publico/PublicoText-Roman-Web.woff2') format('woff2'),
url('https://pudding.cool/assets/fonts/publico/PublicoText-Roman-Web.woff') format('woff');
font-weight: 400;
font-style: normal;
font-stretch: normal;
font-display: swap;
}
@font-face {
font-family: 'Publico Text Web';
src: url('https://pudding.cool/assets/fonts/publico/PublicoText-Bold-Web.woff2') format('woff2'),
url('https://pudding.cool/assets/fonts/publico/PublicoText-Bold-Web.woff') format('woff');
font-weight: 700;
font-style: normal;
font-stretch: normal;
font-display: swap;
}
*/
/*
********************
Atlas Grotesk
********************
*/
@font-face {
font-family: 'Recoleta-Regular';
src: url('assets/fonts/recoleta/recoleta.woff2') format('woff2'),
url('assets/fonts/recoleta/recoleta.woff') format('woff');
font-weight: 400;
font-style: normal;
font-stretch: normal;
font-display: swap;
}
@font-face {
font-family: 'Atlas Grotesk Web';
src: url('https://pudding.cool/assets/fonts/atlas/AtlasGrotesk-Regular-Web.woff2') format('woff2'),
url('https://pudding.cool/assets/fonts/atlas/AtlasGrotesk-Regular-Web.woff') format('woff');
font-weight: 400;
font-style: normal;
font-stretch: normal;
font-display: swap;
}
/* @font-face {
font-family: 'Atlas Grotesk Web';
src: url('https://pudding.cool/assets/fonts/atlas/AtlasGrotesk-Medium-Web.woff2') format('woff2'),
url('https://pudding.cool/assets/fonts/atlas/AtlasGrotesk-Medium-Web.woff') format('woff');
font-weight: 500;
font-style: normal;
font-stretch: normal;
font-display: swap;
} */
/* @font-face {
font-family: 'Atlas Grotesk Web';
src: url('https://pudding.cool/assets/fonts/atlas/AtlasGrotesk-Bold-Web.woff2') format('woff2'),
url('https://pudding.cool/assets/fonts/atlas/AtlasGrotesk-Bold-Web.woff') format('woff');
font-weight: 600;
font-style: normal;
font-stretch: normal;
font-display: swap;
} */
</style>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Inconsolata:wght@500&display=swap" rel="stylesheet">
</head>
<body>
<main id="content">
<div class="intro">
<div class="cover-wrapper"></div>
<div class="cover-score-wrapper">
<div class="cover-score">
</div>
</div>
<div class="swiper-container swiper-container-initialized swiper-container-horizontal swiper-container-pointer-events">
<!-- Additional required wrapper -->
<div class="swiper-wrapper" style="transform: translate3d(0px, 0px, 0px);">
<!-- Slides -->
<div class="swiper-slide login-slide swiper-slide-active" style="width: 800px;">
<div class="title-wrapper">
<h1 class="hed">How Bad Is Your Streaming Music?</h1>
<p class="dek">Our sophisticated A.I. judges your awful taste in music.</p>
<p class="updated-date">Updated 2023</p>
</div>
<div class="logging-in">
<button class="button-main">Find Out</button>
</div>
<div class="bg-shelf-wrapper">
<div class="bg-shelf">
<img src="assets/images/shelf-5.png" alt="">
</div>
<div class="gray-gradient">
</div>
</div>
<div class="bylines">
<p class="logo"> <span>A project by</span> <a alt="The Pudding" href="https://pudding.cool"><svg id="wordmark" x="0px" y="0px" style="enable-background:new 0 0 192.6 50;" xml:space="preserve" viewBox="0 0 192.6 50">
<g>
<path class="st0" d="M150.1,9.5c1.5,0,2.8,1.3,2.8,2.8s-1.3,2.8-2.8,2.8s-2.8-1.3-2.8-2.8S148.6,9.5,150.1,9.5z"></path>
<path class="st0" d="M147.2,17.3h5.6v18.2h-5.6V17.3z"></path>
<path class="st0" d="M77.1,9.5h-1.9h-7v19.3v6.7h5.6v-6.7v-1.4h1.4h1.9c4.9,0,8.9-4,8.9-8.9S82.1,9.5,77.1,9.5z M77.1,21.8h-1.9
h-1.4v-1.4v-3.8v-1.4h1.4h1.9c1.8,0,3.3,1.5,3.3,3.3S79,21.8,77.1,21.8z"></path>
<path class="st0" d="M105.7,17.6h-5.6v8.9c0,1.8-1.5,3.3-3.3,3.3s-3.3-1.5-3.3-3.3v-8.9h-5.6v8.9c0,4.9,4,8.9,8.9,8.9
s8.9-4,8.9-8.9V17.6z"></path>
<path class="st0" d="M164.1,17.6c-4.9,0-8.9,4-8.9,8.9v8.9h5.6v-8.9c0-1.8,1.5-3.3,3.3-3.3s3.3,1.5,3.3,3.3v8.9h5.6v-8.9
C173,21.6,169,17.6,164.1,17.6z"></path>
<path class="st0" d="M119.7,16.2v1.4h-1.4h-1.9c-4.9,0-8.9,4-8.9,8.9s4,8.9,8.9,8.9h1.9h7V16.2V9.5l-5.6,3.3
C119.7,12.8,119.7,16.2,119.7,16.2z M119.8,24.6v3.8v1.4h-1.4h-1.9c-1.8,0-3.3-1.5-3.3-3.3s1.5-3.3,3.3-3.3h1.9h1.4V24.6z"></path>
<path class="st0" d="M139.3,16.2v1.4h-1.4H136c-4.9,0-8.9,4-8.9,8.9s4,8.9,8.9,8.9h1.9h7V16.2V9.5l-5.6,3.3V16.2z M139.4,24.6v3.8
v1.4h-1.5H136c-1.8,0-3.3-1.5-3.3-3.3s1.5-3.3,3.3-3.3h1.9h1.4v1.4H139.4z"></path>
<path class="st0" d="M183.7,17.6c-4.9,0-8.9,4-8.9,8.9s4,8.9,8.9,8.9h1.9h1.4v1.4v0.9v1.4v1.4c0,1.8-1.5,3.3-3.3,3.3
s-3.3-1.5-3.3-3.3V38l-5.6,3.3c0.4,4.5,4.2,8.1,8.9,8.1c4.9,0,8.9-4,8.9-8.9v-1.4v-2.3V17.6h-7H183.7z M187,23.4v1.4v3.8V30h-1.4
h-1.9c-1.8,0-3.3-1.5-3.3-3.3s1.5-3.3,3.3-3.3h1.9C185.6,23.4,187,23.4,187,23.4z"></path>
<path class="st0" d="M28.6,17.6c-1.2,0-2.3,0.2-3.3,0.6V9.5l-5.6,3.3v13.7v2v6.9h5.6v-6.9l0,0v-2c0-1.8,1.5-3.3,3.3-3.3
s3.3,1.5,3.3,3.3v8.9h5.6v-8.9C37.5,21.6,33.5,17.6,28.6,17.6z"></path>
<path class="st0" d="M17.8,9.5H0v5.6h6.1v20.3h5.6V15.1h6.1V9.5z"></path>
<path class="st0" d="M48.3,30.2c-0.4,0-1.2-0.1-1.8-0.4l5.2-2.1l5.6-2.3l-1-2.3l-0.1-0.2c-0.1-0.3-0.3-0.6-0.5-1
c-0.1-0.1-0.1-0.2-0.2-0.3c0,0,0-0.1-0.1-0.1l-0.1-0.1l-0.1-0.1c-1.6-2.2-4-3.5-6.7-3.7l0,0h-0.6c-4.9,0-8.9,4-8.9,8.9
c0,0.4,0,0.9,0.1,1.4l0,0V28c0,0,0,0,0,0.1c0,0,0,0,0,0.1c0,0.3,0.1,0.5,0.2,0.8v0.1v0.1c0.1,0.3,0.2,0.7,0.4,1v0.1v0.1
c0.1,0.3,0.3,0.5,0.4,0.8c0,0.1,0.1,0.1,0.1,0.2l0,0c0.1,0.2,0.3,0.4,0.4,0.6c0,0,0,0,0,0.1c0,0,0,0.1,0.1,0.1l0.1,0.1
c1.7,2.1,4.4,3.4,7.2,3.4h6.1v-5.2C54.5,30.2,50.6,30.2,48.3,30.2L48.3,30.2z M56.2,22.9L56.2,22.9L56.2,22.9z M44.6,25.7
L44.6,25.7l-0.2,0.1c0.2-1.9,1.8-3.5,3.7-3.5c0.9,0,1.8,0.4,2.4,0.9L46.2,25L44.6,25.7L44.6,25.7z"></path>
</g>
</svg></a></p>
<div class="privacy-names">
<p class="names">A.I. trained by <a href="https://pudding.cool/author/mike-lacher/">Mike Lacher</a> & <a href="https://pudding.cool/author/matt-daniels/">Matt Daniels</a></p>
<p class="privacy-q">Data questions? Answers and privacy policy <a class="data-privacy">here</a>.</p>
</div>
</div>
</div>
<div class="swiper-slide ai-building-slide swiper-slide-next" style="width: 800px;">
<div class="title-wrapper ai-building-slide-title #test">
</div>
<div class="swiper-container-2">
<div class="swiper-wrapper">
<div class="swiper-slide">
<img class="fantano" src="assets/images/fantano_2.png" alt="">
</div>
<div class="swiper-slide">
<img class="pitchfork" src="assets/images/pitchfork_2.png" alt="">
</div>
<div class="swiper-slide">
<img class="pigeons" src="assets/images/pigeons.png" alt="">
</div>
<div class="swiper-slide">
<img class="tiny" src="assets/images/tiny.png" alt="">
</div>
<div class="swiper-slide">
<img class="vegan" src="assets/images/vegan.png" alt="">
</div>
<div class="swiper-slide">
<img class="thirty" src="assets/images/33.png" alt="">
</div>
<div class="swiper-slide">
<img class="stereo" src="assets/images/stereo.png" alt="">
</div>
</div>
</div>
</div>
<div class="swiper-slide loading-slide" style="width: 800px;">
<div class="score-section">
<div class="score-wrapper">
<p>Score:</p>
<p class="score-num"></p>
<p class="score-text"><span>Awaiting Data</span></p>
</div>
</div>
<div class="chat-section">
<div class="chat-wrapper">
</div>
</div>
<div class="data-output">
</div>
</div>
<div class="swiper-slide score-slide" style="width: 800px;">
<div class="score-chat">
<div class="score-chat-special"></div>
</div>
</div>
</div>
</div>
<div class="score-slide">
<div class="score-chat">
<div class="score-chat-special"></div>
</div>
<div class="ascii-art">
<!-- <pre>
____ _ ____ _
| _ \ ___ __ _ ___| |_| __ ) ___ | |_
| |_) / _ \ / _` / __| __| _ \ / _ \| __|
| _ < (_) | (_| \__ \ |_| |_) | (_) | |_
|_| \_\___/ \__,_|___/\__|____/ \___/ \__|
</pre> -->
</div>
<div class="footer">
<footer class="pudding-footer">
<div class="footer-recirc">
<div class="footer-recirc__articles"></div>
</div>
<div class="footer-company">
<div class="footer-company__cta">
<ul class="footer-company__cta-list">
<li>
<a href="https://facebook.com/pudding.viz/">
<svg width="24" height="24" fill="#000000" stroke="currentColor" stroke-width=".2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-facebook" viewBox="0 0 24 24"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"></path></svg>
<p>FACEBOOK</p>
</a>
</li>
<li>
<a href="https://twitter.com/puddingviz/">
<svg width="24" height="24" fill="#000" stroke="currentColor" stroke-width="0" stroke-linecap="round" stroke-linejoin="round" class="feather feather-twitter" viewBox="0 0 24 24"><path d="M23 3a10.9 10.9 0 0 1-3.14 1.53 4.48 4.48 0 0 0-7.86 3v1A10.66 10.66 0 0 1 3 4s-4 9 5 13a11.64 11.64 0 0 1-7 2c9 5 20 0 20-11.5a4.5 4.5 0 0 0-.08-.83A7.72 7.72 0 0 0 23 3z"></path></svg>
<p>TWITTER</p>
</a>
</li>
<li>
<a href="https://www.instagram.com/the.pudding">
<svg width="24" height="24" id="Layer_1" x="0px" y="0px" enable-background="new 0 0 24 24" xml:space="preserve" viewBox="0 0 24 24">
<path d="M17,23H7c-3.3,0-6-2.7-6-6V7c0-3.3,2.7-6,6-6h10c3.3,0,6,2.7,6,6v10C23,20.3,20.3,23,17,23z M7,3C4.8,3,3,4.8,3,7v10
c0,2.2,1.8,4,4,4h10c2.2,0,4-1.8,4-4V7c0-2.2-1.8-4-4-4H7z"></path>
<path d="M12,17c-1.1,0-2.1-0.3-3-1c-1.1-0.8-1.8-2-2-3.3C6.7,10,8.6,7.4,11.3,7c0.5-0.1,1-0.1,1.5,0c2.2,0.3,3.9,2,4.2,4.2l0,0
c0.2,1.3-0.1,2.6-0.9,3.7c-0.8,1.1-2,1.8-3.3,2C12.5,16.9,12.3,17,12,17z M12,9c-0.1,0-0.3,0-0.4,0c-1.6,0.2-2.8,1.8-2.5,3.4
c0.2,1.6,1.8,2.8,3.4,2.5c0.8-0.1,1.5-0.5,2-1.2s0.7-1.4,0.6-2.2l0,0c-0.2-1.3-1.2-2.3-2.5-2.5C12.3,9,12.2,9,12,9z"></path>
<path d="M17.5,7.5c-0.3,0-0.5-0.1-0.7-0.3c-0.1-0.1-0.2-0.2-0.2-0.3c-0.1-0.1-0.1-0.2-0.1-0.4c0-0.3,0.1-0.5,0.3-0.7
c0.4-0.4,1-0.4,1.4,0c0.2,0.2,0.3,0.4,0.3,0.7c0,0.1,0,0.3-0.1,0.4s-0.1,0.2-0.2,0.3C18,7.4,17.8,7.5,17.5,7.5z"></path>
</svg>
<p>INSTAGRAM</p>
</a>
</li>
<li>
<a href="https://patreon.com/thepudding/">
<svg id="Layer_1" width="24" height="24" x="0px" y="0px" enable-background="new 0 0 24 24" xml:space="preserve" viewBox="0 0 24 24">
<g>
<path fill-rule="evenodd" clip-rule="evenodd" stroke-linecap="round" stroke-linejoin="round" d="
M15.7,3.3c-3.7,0-6.8,3-6.8,6.8c0,3.7,3,6.7,6.8,6.7c3.7,0,6.7-3,6.7-6.7C22.4,6.3,19.4,3.3,15.7,3.3"></path>
<rect x="3.7" y="3.3" stroke-linecap="round" stroke-linejoin="round" width="3.3" height="18"></rect>
</g>
</svg>
<p>PATREON</p>
</a>
</li>
<li>
<a href="https://pudding.cool/about">
<svg width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-info" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="16" x2="12" y2="12"></line><line x1="12" y1="8" x2="12" y2="8"></line></svg>
<p>ABOUT</p>
</a>
</li>
<li>
<a href="https://pudding.cool/privacy/">
<svg width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-lock" viewBox="0 0 24 24"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg>
<p>PRIVACY</p>
</a>
</li>
<li>
<a href="http://eepurl.com/czym6f">
<svg width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-mail" viewBox="0 0 24 24"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg>
<p>NEWSLETTER</p>
</a>
</li>
<li>
<a href="https://pudding.cool/feed/index.xml">
<svg width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-rss" viewBox="0 0 24 24"><path d="M4 11a9 9 0 0 1 9 9"></path><path d="M4 4a16 16 0 0 1 16 16"></path><circle cx="5" cy="19" r="1"></circle></svg>
<p>RSS</p>
</a>
</li>
</ul>
</div>
<div class="footer-company__about">
<svg id="wordmark" x="0px" y="0px" style="enable-background:new 0 0 192.6 50;" xml:space="preserve" viewBox="0 0 192.6 50">
<g>
<path class="st0" d="M150.1,9.5c1.5,0,2.8,1.3,2.8,2.8s-1.3,2.8-2.8,2.8s-2.8-1.3-2.8-2.8S148.6,9.5,150.1,9.5z"></path>
<path class="st0" d="M147.2,17.3h5.6v18.2h-5.6V17.3z"></path>
<path class="st0" d="M77.1,9.5h-1.9h-7v19.3v6.7h5.6v-6.7v-1.4h1.4h1.9c4.9,0,8.9-4,8.9-8.9S82.1,9.5,77.1,9.5z M77.1,21.8h-1.9
h-1.4v-1.4v-3.8v-1.4h1.4h1.9c1.8,0,3.3,1.5,3.3,3.3S79,21.8,77.1,21.8z"></path>
<path class="st0" d="M105.7,17.6h-5.6v8.9c0,1.8-1.5,3.3-3.3,3.3s-3.3-1.5-3.3-3.3v-8.9h-5.6v8.9c0,4.9,4,8.9,8.9,8.9
s8.9-4,8.9-8.9V17.6z"></path>
<path class="st0" d="M164.1,17.6c-4.9,0-8.9,4-8.9,8.9v8.9h5.6v-8.9c0-1.8,1.5-3.3,3.3-3.3s3.3,1.5,3.3,3.3v8.9h5.6v-8.9
C173,21.6,169,17.6,164.1,17.6z"></path>
<path class="st0" d="M119.7,16.2v1.4h-1.4h-1.9c-4.9,0-8.9,4-8.9,8.9s4,8.9,8.9,8.9h1.9h7V16.2V9.5l-5.6,3.3
C119.7,12.8,119.7,16.2,119.7,16.2z M119.8,24.6v3.8v1.4h-1.4h-1.9c-1.8,0-3.3-1.5-3.3-3.3s1.5-3.3,3.3-3.3h1.9h1.4V24.6z"></path>
<path class="st0" d="M139.3,16.2v1.4h-1.4H136c-4.9,0-8.9,4-8.9,8.9s4,8.9,8.9,8.9h1.9h7V16.2V9.5l-5.6,3.3V16.2z M139.4,24.6v3.8
v1.4h-1.5H136c-1.8,0-3.3-1.5-3.3-3.3s1.5-3.3,3.3-3.3h1.9h1.4v1.4H139.4z"></path>
<path class="st0" d="M183.7,17.6c-4.9,0-8.9,4-8.9,8.9s4,8.9,8.9,8.9h1.9h1.4v1.4v0.9v1.4v1.4c0,1.8-1.5,3.3-3.3,3.3
s-3.3-1.5-3.3-3.3V38l-5.6,3.3c0.4,4.5,4.2,8.1,8.9,8.1c4.9,0,8.9-4,8.9-8.9v-1.4v-2.3V17.6h-7H183.7z M187,23.4v1.4v3.8V30h-1.4
h-1.9c-1.8,0-3.3-1.5-3.3-3.3s1.5-3.3,3.3-3.3h1.9C185.6,23.4,187,23.4,187,23.4z"></path>
<path class="st0" d="M28.6,17.6c-1.2,0-2.3,0.2-3.3,0.6V9.5l-5.6,3.3v13.7v2v6.9h5.6v-6.9l0,0v-2c0-1.8,1.5-3.3,3.3-3.3
s3.3,1.5,3.3,3.3v8.9h5.6v-8.9C37.5,21.6,33.5,17.6,28.6,17.6z"></path>
<path class="st0" d="M17.8,9.5H0v5.6h6.1v20.3h5.6V15.1h6.1V9.5z"></path>
<path class="st0" d="M48.3,30.2c-0.4,0-1.2-0.1-1.8-0.4l5.2-2.1l5.6-2.3l-1-2.3l-0.1-0.2c-0.1-0.3-0.3-0.6-0.5-1
c-0.1-0.1-0.1-0.2-0.2-0.3c0,0,0-0.1-0.1-0.1l-0.1-0.1l-0.1-0.1c-1.6-2.2-4-3.5-6.7-3.7l0,0h-0.6c-4.9,0-8.9,4-8.9,8.9
c0,0.4,0,0.9,0.1,1.4l0,0V28c0,0,0,0,0,0.1c0,0,0,0,0,0.1c0,0.3,0.1,0.5,0.2,0.8v0.1v0.1c0.1,0.3,0.2,0.7,0.4,1v0.1v0.1
c0.1,0.3,0.3,0.5,0.4,0.8c0,0.1,0.1,0.1,0.1,0.2l0,0c0.1,0.2,0.3,0.4,0.4,0.6c0,0,0,0,0,0.1c0,0,0,0.1,0.1,0.1l0.1,0.1
c1.7,2.1,4.4,3.4,7.2,3.4h6.1v-5.2C54.5,30.2,50.6,30.2,48.3,30.2L48.3,30.2z M56.2,22.9L56.2,22.9L56.2,22.9z M44.6,25.7
L44.6,25.7l-0.2,0.1c0.2-1.9,1.8-3.5,3.7-3.5c0.9,0,1.8,0.4,2.4,0.9L46.2,25L44.6,25.7L44.6,25.7z"></path>
</g>
</svg>
<p class="footer-company__description"><a href="https://pudding.cool">The Pudding</a> is a digital publication
that
explains ideas debated in culture with visual essays.</p>
</div>
</div>
</footer>
</div>
</div>
<div class="gradient-wrapper">
<div class="gradient-overlay">
</div>
<div class="gradient">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 1024" fill="none">
<circle cx="588" cy="579" r="677" fill="url(#paint0_linear)"></circle>
<circle cx="1349" cy="1189" r="677" fill="#FC7E37"></circle>
<circle cx="1658" cy="-104" r="677" fill="#E48586"></circle>
<circle cx="-164" cy="-136" r="677" fill="#764FFB"></circle>
<defs>
<linearGradient id="paint0_linear" x1="588" y1="-98" x2="588" y2="1256" gradientUnits="userSpaceOnUse">
<stop stop-color="#62BCFF"></stop>
<stop offset="1" stop-color="#1A9CFC"></stop>
</linearGradient>
</defs>
</svg>
</div>
</div>
<div class="data-modal">
<div class="data-modal-container">
<button type="button" name="close-button">Close</button>
<p>This is a satirical project and does not use real artificial intelligence, but a faux pretentious music-loving AI. The code creates a custom blend of jokes from our database paired with the insights found in the artist, album, genre, and track data from your Spotify or Apple Music.</p>
<p>This project does not save any Spotify or Apple Music data. When you log-in with Spotify or Apple account, it creates a special, one-time code to read your top songs and tracks, as well as recent playlists. That access goes away until you come back.</p>
<p>To remove ties between your Spotify account and this project, click remove access for “Bad Music” on Spotify’s 3rd Party app page <a href="https://www.spotify.com/account/apps/">here</a>.</p>
<p>To log out of your Apple Music account, go <a href="https://music-bot-pudding.herokuapp.com/applemusiclogout">here</a>.</p>
<p>You can also find our site-wide privacy policy <a href="https://pudding.cool/privacy/">here</a>.</p>
</div>
</div>
</div>
</main>
<script src="https://js-cdn.music.apple.com/musickit/v1/musickit.js"></script>
<script src="https://pudding.cool/assets/scripts/d3.v6.0.0.min.js"></script>
<script src="bundle.js?version=1732830026789"></script>
</body></html>