*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{background:#101211;color:#f5f1e8;font-family:Arial,"Helvetica Neue",sans-serif}.shell{position:relative;width:100%;height:100%;min-height:650px;padding:30px 48px;background:#101211}.topbar{height:42px;color:#b8c4b6;font-size:13px;letter-spacing:.08em;text-transform:uppercase}.topbar strong{color:#f5f1e8}.topbar span{float:right;color:#b6d64b}.card{position:absolute;top:50%;left:50%;width:770px;max-width:calc(100% - 96px);transform:translate(-50%,-52%);display:-webkit-flex;display:flex;background:#1b231f;border:1px solid #39443c}.copy,.form{padding:50px 42px}.copy{width:52%;background:#202b25}.form{width:48%}.eyebrow{color:#b6d64b;font-size:11px;font-weight:bold;letter-spacing:.17em;margin:0 0 18px}.copy h1{font-family:Georgia,serif;font-weight:normal;font-size:49px;line-height:1.01;margin:0 0 22px}.copy h1 em{color:#b6d64b}.copy p:not(.eyebrow){color:#aab3aa;line-height:1.65;font-size:15px}.primary,.secondary{width:100%;padding:15px;border:0;border-radius:2px;font-weight:bold;cursor:pointer}.primary{background:#b6d64b;color:#182015}.primary span{font-size:20px;margin-left:8px}.secondary{background:#344238;color:#f5f1e8;margin-top:12px}.or{color:#899389;text-align:center;font-size:12px;margin:25px 0}label{display:block;color:#dfe4db;text-transform:uppercase;letter-spacing:.1em;font-size:11px;margin:3px 0 10px}input{display:block;width:100%;color:#f5f1e8;background:#111613;border:1px solid #465148;padding:14px 13px;outline:0;border-radius:2px;font-size:20px;letter-spacing:.2em;text-align:center}input:focus{border-color:#b6d64b}.message{color:#a7b0a5;font-size:12px;line-height:1.5;min-height:18px}.player{position:absolute;top:50%;left:50%;width:900px;max-width:calc(100% - 96px);transform:translate(-50%,-50%);display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center}.art{position:relative;width:390px;height:390px;flex-shrink:0;margin-right:130px;background:#27332b}.art img{width:100%;height:100%;display:block;object-fit:cover}.art #placeholder{position:absolute;top:0;left:0;width:100%;height:100%;text-align:center;padding-top:125px;color:#b6d64b;font-size:90px}.details{min-width:0;flex:1}.details h2{font-family:Georgia,serif;font-size:39px;font-weight:normal;line-height:1.06;margin:0 0 18px;word-wrap:break-word;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.details p:not(.eyebrow):not(.message){color:#d6dbd2;font-size:18px;margin:0 0 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.controls{margin-top:44px;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center}.round,.play{border:0;cursor:pointer;border-radius:50%;padding:0;position:relative}.round{width:46px;height:46px;background:#27332b}.play{width:58px;height:58px;background:#b6d64b;margin:0 18px}.icon-play:before{content:'';position:absolute;top:50%;left:50%;width:0;height:0;border-style:solid;border-width:10px 0 10px 16px;border-color:transparent transparent transparent #182015;-webkit-transform:translate(-35%,-50%);transform:translate(-35%,-50%)}.icon-play.is-playing:before{border-style:none;width:5px;height:18px;background:#182015;-webkit-transform:translate(-9px,-50%);transform:translate(-9px,-50%)}.icon-play:after{content:none}.icon-play.is-playing:after{content:'';position:absolute;top:50%;left:50%;width:5px;height:18px;background:#182015;-webkit-transform:translate(4px,-50%);transform:translate(4px,-50%)}.icon-prev:before{content:'';position:absolute;top:50%;left:50%;width:0;height:0;border-style:solid;border-width:8px 13px 8px 0;border-color:transparent #f5f1e8 transparent transparent;-webkit-transform:translate(-2px,-50%);transform:translate(-2px,-50%)}.icon-prev:after{content:'';position:absolute;top:50%;left:50%;width:3px;height:16px;background:#f5f1e8;-webkit-transform:translate(-15px,-50%);transform:translate(-15px,-50%)}.icon-next:before{content:'';position:absolute;top:50%;left:50%;width:0;height:0;border-style:solid;border-width:8px 0 8px 13px;border-color:transparent transparent transparent #f5f1e8;-webkit-transform:translate(-15px,-50%);transform:translate(-15px,-50%)}.icon-next:after{content:'';position:absolute;top:50%;left:50%;width:3px;height:16px;background:#f5f1e8;-webkit-transform:translate(12px,-50%);transform:translate(12px,-50%)}.timeline{margin-top:26px}.timeline-track{width:100%;height:4px;border-radius:2px;background:#344238;overflow:hidden}.timeline-fill{width:0;height:100%;background:#b6d64b}.timeline-time{margin-top:8px;display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between;color:#a7b0a5;font-size:12px}.small-button{width:auto;padding:10px 16px;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.link{border:0;background:transparent;color:#899389;padding:10px 0;cursor:pointer}.actions{margin-top:14px;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-align-items:center;align-items:center}.actions>*{margin:6px 14px 0 0}.actions .secondary{margin-top:6px}.minimalist-track{display:none}.modal{position:fixed;z-index:5;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.72);text-align:center}.modal-box{position:absolute;top:50%;left:50%;width:330px;max-width:80%;transform:translate(-50%,-50%);padding:30px;background:#1b231f;border:1px solid #566355;box-shadow:0 15px 45px #000}.modal-box p{margin:0 0 24px;font-family:Georgia,serif;font-size:26px}.modal-box button{width:100%;text-transform:uppercase;font-size:12px}.modal-box .secondary{margin-top:10px}.artist-box{width:420px;text-align:left}.artist-box p{font-size:22px;margin-bottom:16px}.artist-box input{text-align:left;letter-spacing:normal;font-size:16px}.artist-results{max-height:260px;overflow-y:auto;margin-top:14px}.artist-box .artist-result{display:block;width:100%;text-align:left;background:#27332b;color:#f5f1e8;border:0;padding:10px 12px;margin-top:8px;border-radius:2px;cursor:pointer;font-size:14px;text-transform:none}.artist-box .artist-result:first-child{margin-top:0}.hidden{display:none!important}body.minimalist .topbar,body.minimalist footer{display:none}body.minimalist .player{top:50%;left:50%;width:100%;max-width:none;transform:translate(-50%,-50%);display:block;text-align:center}.minimalist .details{display:none}.minimalist .art{width:70vh;height:70vh;max-width:80vw;max-height:70vh;margin:0 auto}.minimalist-track{position:absolute;display:block;left:0;right:0;top:100%;padding-top:18px;margin:0;color:#f5f1e8;font-size:20px;line-height:1.35}.minimalist-track span{display:block}.minimalist-track span:first-child{color:#b6d64b;font-size:13px}.minimalist .art{cursor:pointer}@media(max-width:800px){.shell{padding:22px}.card,.player{max-width:calc(100% - 44px)}.copy,.form{padding:30px 25px}.copy h1{font-size:38px}.art{width:300px;height:300px;margin-right:36px}footer{left:22px}}
.copy .independent{color:#b6d64b!important;font-size:11px!important;line-height:1.4!important;margin-top:28px}

/* Narrow phones: keep the setup card in two readable rows. This uses only
   media queries, block layout, and 2000s-era flex fallbacks for iOS 9 Safari. */
footer{position:absolute;left:48px;right:48px;bottom:18px;text-align:center;color:#899389;font-size:11px;line-height:1.4}.footer-link{color:#b6d64b;text-decoration:none}.footer-link:active,.footer-link:hover{text-decoration:underline}
@media(max-width:600px){html,body{height:auto;min-height:100%;overflow:auto}.shell{height:auto;min-height:100%;padding:18px 14px 10px}.topbar{height:34px;font-size:11px}.card{position:relative;top:auto;left:auto;width:100%;max-width:none;transform:none;margin:18px auto 0;display:block}.copy,.form{display:block;width:100%;padding:28px 24px}.copy{min-height:0}.copy h1{font-size:48px;line-height:1.02;margin-bottom:22px}.copy p:not(.eyebrow){font-size:16px;line-height:1.55}.copy .independent{margin-top:26px}.form{border-top:1px solid #39443c}.primary,.secondary{font-size:15px;line-height:1.25;padding:16px 14px}.or{margin:22px 0}.form input{font-size:20px;padding:14px 10px}footer{position:relative;left:auto;right:auto;bottom:auto;margin:18px 8px 8px;font-size:10px}}
@media(min-width:601px) and (max-width:800px){footer{left:22px;right:22px}}
@media(max-width:600px){.player{position:relative;top:auto;left:auto;width:100%;max-width:none;transform:none;display:block;margin:28px auto 60px;text-align:center}.art{width:78vw;height:78vw;max-width:360px;max-height:360px;margin:0 auto 26px}.details{text-align:left}.details h2{font-size:30px}.controls{margin-top:28px}.actions{display:block}.actions>*{display:block;margin:8px 0 0}.actions .secondary{width:100%}body.minimalist .player{position:absolute;top:50%;left:50%;width:100%;margin:0;transform:translate(-50%,-50%)}body.minimalist .art{margin:0 auto}}