.may-player-route .site-main{background:#000}
.may-player-page{
      
      --bg: #000;
      --bg-2: #000;
      --text: #f7f8fa;
      --muted: #9da2ad;
      --line: rgba(255,255,255,.10);
      --glass: rgba(255,255,255,.055);
      --glass-2: rgba(255,255,255,.085);
      --pink: #ff3e9e;
      --pink-2: #ff6aba;
      --violet: #8f62ff;
      
      --shadow: 0 30px 90px rgba(0,0,0,.45);

      
      --radius: 28px;

      
      --max: 1180px;
    }
.may-player-page *{ box-sizing: border-box; }
.may-player-page{
      scroll-behavior: smooth;
      max-width:100%;
      overflow-x:clip;
      background:#07080a;
    }
.may-player-page{
      margin: 0;
      min-height:0;
      max-width:100%;
      position:relative;
      isolation:isolate;
      color: var(--text);
      font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
      background:
        linear-gradient(180deg, #07080a 0%, #090a0d 48%, #07080a 100%);
      overflow-x:clip;
    }
.may-player-page::after{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      background:
        radial-gradient(circle 560px at 12% 12%, rgba(255,62,158,.14) 0%, rgba(255,62,158,.060) 36%, transparent 72%),
        radial-gradient(circle 520px at 87% 28%, rgba(143,98,255,.12) 0%, rgba(143,98,255,.050) 38%, transparent 73%),
        radial-gradient(circle 500px at 18% 88%, rgba(255,62,158,.085) 0%, rgba(255,62,158,.032) 40%, transparent 74%),
        radial-gradient(circle 540px at 84% 82%, rgba(143,98,255,.075) 0%, rgba(143,98,255,.028) 40%, transparent 74%);
      z-index:-2;
    }
.may-player-page::before{
      content: "";
      position: fixed;
      inset: 0;
      pointer-events: none;
      opacity: .20;
      background-image:
        linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
      background-size: 52px 52px;
      z-index: -1;
    }
.may-player-page a{ color: inherit; text-decoration: none; }
.may-player-page button,
.may-player-page a{ -webkit-tap-highlight-color: transparent; }
.may-player-page .wrap{ width: min(var(--max), calc(100% - 40px)); margin: 0 auto; }
.may-player-page .hero{
      position: relative;
      min-height: 780px;
      display:grid;
      grid-template-columns: .88fr 1.12fr;
      align-items:center;
      gap: 74px;
      padding: 70px 0 68px;
    }
.may-player-page .hero-copy{ position:relative; z-index:2; }
.may-player-page .eyebrow{
      display:inline-flex; align-items:center; gap:9px;
      padding: 8px 11px;
      border-radius:999px;
      border:1px solid var(--line);
      background:rgba(255,255,255,.04);
      color:#dadce2;
      font-size:12px;
      font-weight:700;
      letter-spacing:.06em;
      text-transform:uppercase;
    }
.may-player-page .eyebrow::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--pink); box-shadow:0 0 15px rgba(255,62,158,.8); }
.may-player-page h1{
      font-size: clamp(58px, 8vw, 112px);
      line-height: .88;
      letter-spacing: -.075em;
      margin: 24px 0 26px;
      max-width: 760px;
    }
.may-player-page .accent-word{
      display:inline-block;
      
      padding-bottom:.10em;
      margin-bottom:-.10em;
      background: linear-gradient(100deg, #fff 0 10%, #ff7bc4 45%, #bd7dff 75%, #fff 100%);
      -webkit-background-clip:text; background-clip:text; color:transparent;
      overflow:visible;
    }
.may-player-page .lead{ max-width: 650px; color:#afb3bd; font-size:18px; line-height:1.65; margin:0 0 30px; }
.may-player-page .lead strong{ color:#fff; font-weight:650; }
.may-player-page .hero-actions{ display:flex; flex-wrap:wrap; gap:12px; margin-bottom:24px; }
.may-player-page .btn{
      min-height: 58px;
      display:inline-flex; align-items:center; justify-content:center; gap:11px;
      padding: 0 22px;
      border-radius: 17px;
      font-weight:800;
      letter-spacing:-.01em;
      border:1px solid transparent;
      transition: transform .2s ease, border-color .2s ease, background .2s ease;
    }
.may-player-page .btn svg{ width:21px; height:21px; flex:0 0 auto; }
.may-player-page .btn.primary{ color:#101014; background:linear-gradient(135deg, #fff, #ededf1); box-shadow:0 16px 50px rgba(255,255,255,.10); }
.may-player-page .btn.secondary{ color:#101014; background:rgba(255,255,255,1); }
.may-player-page .btn:hover{ transform: translateY(-2px); }
.may-player-page .micro{ color:#777d88; font-size:12px; display:flex; align-items:center; flex-wrap:wrap; gap:10px 16px; }
.may-player-page .micro span{ display:inline-flex; align-items:center; gap:7px; }
.may-player-page .micro i{ width:5px; height:5px; border-radius:50%; background:#626874; display:inline-block; }
.may-player-page .visual-stage{
      position:relative;
      min-height:650px;
      display:grid;
      place-items:center;
      isolation:isolate;
    }
.may-player-page .hero-devices{
      position:relative;
      width:min(720px, 100%);
      height:620px;
    }
.may-player-page .halo{
      position:absolute;
      width:650px;
      height:650px;
      border-radius:50%;
      background:
        radial-gradient(circle at 70% 24%, rgba(255,92,165,.27), transparent 28%),
        radial-gradient(circle at 30% 60%, rgba(123,55,137,.22), transparent 38%),
        radial-gradient(circle, rgba(255,62,158,.13), rgba(160,71,255,.08) 45%, transparent 72%);
      filter: blur(18px);
      animation: breathe 6s ease-in-out infinite;
      z-index:-1;
    }
@keyframes breathe{ 50% { transform:scale(1.045); opacity:.82; } }
.may-player-page .desktop-device{
      position:absolute;
      width:min(620px, 91%);
      aspect-ratio:16 / 9;
      left:0;
      top:145px;
      padding:9px;
      border-radius:24px;
      background:linear-gradient(150deg,rgba(255,255,255,.28),rgba(255,255,255,.075) 18%,rgba(255,255,255,.025) 70%);
      border:1px solid rgba(255,255,255,.19);
      box-shadow:0 60px 125px rgba(0,0,0,.55),0 0 80px rgba(106,30,91,.10),inset 0 1px 1px rgba(255,255,255,.20);
      transform:rotate(-.6deg);
      z-index:1;
      transform-origin:center;
    }
.may-player-page .desktop-screen{
      position:relative;
      width:100%; height:100%; overflow:hidden;
      border-radius:16px;
      border:1px solid rgba(255,255,255,.07);
      background:#382038;
      box-shadow:inset 0 0 0 1px rgba(0,0,0,.32);
    }
.may-player-page .desktop-screen::after,
.may-player-page .phone-screen::after{
      content:""; position:absolute; inset:0; pointer-events:none;
      background:linear-gradient(112deg,rgba(255,255,255,.06),transparent 20%,transparent 74%,rgba(255,255,255,.014));
      mix-blend-mode:screen;
    }
.may-player-page .pc-ui{ position:absolute; inset:0; display:grid; grid-template-columns:122px 1fr; color:#f8edf7; font-size:7px; }
.may-player-page .pc-sidebar{
      background:linear-gradient(180deg,rgba(27,20,31,.96),rgba(38,27,42,.97));
      border-right:1px solid rgba(255,255,255,.035); padding:13px 9px 10px;
    }
.may-player-page .pc-brand{ display:flex; align-items:center; gap:7px; font-size:9px; font-weight:850; margin-bottom:16px; }
.may-player-page .pc-brand-badge{ width:17px;height:17px;border-radius:6px;display:grid;place-items:center;background:#662d55;color:#ff65ae;font-size:9px;box-shadow:inset 0 1px 0 rgba(255,255,255,.1); }
.may-player-page .pc-brand strong{ background:linear-gradient(90deg,#fff,#ff78bd);-webkit-background-clip:text;background-clip:text;color:transparent; }
.may-player-page .pc-section{ color:#84768c; font-size:5px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; margin:8px 4px 5px; }
.may-player-page .pc-nav{ display:grid; gap:2px; }
.may-player-page .pc-nav-item{ height:22px; display:flex; align-items:center; gap:7px; padding:0 7px; border-radius:8px; color:#c6b8cb; }
.may-player-page .pc-nav-item .ico{ width:12px; text-align:center; color:#b7a6bd; font-size:8px; }
.may-player-page .pc-nav-item.active{ color:#ff66ae; background:linear-gradient(90deg,rgba(142,46,100,.56),rgba(123,43,89,.46)); box-shadow:inset 2px 0 #ff54a2; }
.may-player-page .pc-nav-item.active .ico{ color:#ff66ae; }
.may-player-page .pc-nav-count{ margin-left:auto; color:#8f8295; font-size:5px; }
.may-player-page .pc-workspace{ position:relative; min-width:0; background:linear-gradient(180deg,#3d203c 0%,#392239 55%,#322536 100%); overflow:hidden; }
.may-player-page .pc-topbar{ height:34px; display:flex; align-items:center; gap:7px; padding:0 14px; }
.may-player-page .pc-round{ width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.055);color:#d9cadb;font-size:7px; }
.may-player-page .pc-page-title{ font-size:10px; font-weight:800; margin-left:3px; }
.may-player-page .pc-top-spacer{ flex:1; }
.may-player-page .pc-timer,
.may-player-page .pc-search{ height:20px; border-radius:10px; display:flex; align-items:center; padding:0 9px; background:rgba(255,255,255,.055); color:#c7b9cb; border:1px solid rgba(255,255,255,.025); }
.may-player-page .pc-timer{ width:116px; justify-content:space-between; font-size:5px; }
.may-player-page .pc-search{ width:144px; justify-content:space-between; font-size:6px; }
.may-player-page .pc-window{ color:#a99cac; letter-spacing:7px; margin-left:4px; font-size:7px; white-space:nowrap; }
.may-player-page .pc-main{ position:absolute; left:0; right:0; top:34px; bottom:0; padding:40px 42px 16px 74px; }
.may-player-page .pc-now{ display:grid; grid-template-columns:184px 1fr; gap:26px; align-items:center; }
.may-player-page .pc-album{ width:184px; aspect-ratio:1; border-radius:7px; position:relative; overflow:hidden; background:
      radial-gradient(circle at 68% 22%,rgba(255,105,196,.95),transparent 16%),
      radial-gradient(circle at 32% 52%,rgba(91,228,255,.82),transparent 19%),
      radial-gradient(circle at 64% 68%,rgba(255,74,115,.92),transparent 18%),
      linear-gradient(135deg,#531e7d 0%,#ff5c9c 38%,#41204f 72%,#161425 100%);
      box-shadow:0 14px 38px rgba(0,0,0,.33),inset 0 0 0 4px rgba(0,0,0,.6);
    }
.may-player-page .pc-album::before{ content:"MAY"; position:absolute; left:10px; bottom:8px; font-size:32px; font-weight:950; letter-spacing:-.08em; color:rgba(255,255,255,.74); transform:skew(-9deg); text-shadow:0 2px 9px rgba(0,0,0,.25); }
.may-player-page .pc-album::after{ content:"PLAY"; position:absolute; right:12px; top:13px; font-size:10px; font-weight:900; letter-spacing:.12em; color:rgba(255,255,255,.8); }
.may-player-page .pc-track h4{ font-size:13px; margin:0 0 6px; letter-spacing:-.03em; }
.may-player-page .pc-track p{ margin:0 0 9px; color:#c6a9c4; font-size:7px; }
.may-player-page .pc-badges{ display:flex; gap:5px; margin-bottom:10px; }
.may-player-page .pc-badge{ padding:4px 7px; border-radius:8px; background:rgba(255,255,255,.05); color:#bfa8bf; font-size:5px; }
.may-player-page .pc-actions{ display:flex; gap:13px; color:#c5afc3; font-size:10px; }
.may-player-page .pc-progress-wrap{ margin-top:18px; }
.may-player-page .pc-progress{ height:3px; background:rgba(10,5,11,.42); border-radius:5px; position:relative; }
.may-player-page .pc-progress span{ display:block; width:42%; height:100%; border-radius:inherit; background:#f4499a; }
.may-player-page .pc-progress span::after{ content:""; position:absolute; left:42%; top:50%; width:6px;height:6px;border-radius:50%; background:#f4499a; transform:translate(-50%,-50%); }
.may-player-page .pc-times{ display:flex; justify-content:space-between; margin-top:5px; color:#b39fb4; font-size:5px; }
.may-player-page .pc-controls-row{ position:relative; display:flex; justify-content:center; align-items:center; gap:18px; margin-top:9px; color:#d6c4d5; font-size:8px; }
.may-player-page .pc-play{ width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#ef4d9e;color:#fff;font-size:10px;box-shadow:0 8px 20px rgba(239,77,158,.24); }
.may-player-page .pc-volume{ display:flex; align-items:center; gap:6px; margin:7px auto 0; width:120px; }
.may-player-page .pc-volume-line{ height:3px; flex:1; border-radius:5px; background:rgba(255,255,255,.15); overflow:hidden; }
.may-player-page .pc-volume-line i{ display:block; width:66%; height:100%; background:#ef4d9e; }
.may-player-page .pc-next{ margin-top:25px; }
.may-player-page .pc-next-label{ color:#9f8ca1; font-size:5px; letter-spacing:.13em; text-transform:uppercase; margin-bottom:5px; }
.may-player-page .pc-next-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.may-player-page .pc-song-card{ height:38px; border-radius:9px; background:rgba(255,255,255,.075); display:flex; align-items:center; gap:8px; padding:5px 7px; }
.may-player-page .pc-song-cover{ width:25px;height:25px;border-radius:6px;flex:0 0 auto;background:linear-gradient(135deg,#b51b52,#2d122a); }
.may-player-page .pc-song-card:nth-child(2) .pc-song-cover{ background:linear-gradient(135deg,#f7dce9,#8d75aa 52%,#3b2347); }
.may-player-page .pc-song-card:nth-child(3) .pc-song-cover{ background:linear-gradient(135deg,#d42046,#52131f 55%,#120b13); }
.may-player-page .pc-song-copy{ min-width:0; }
.may-player-page .pc-song-copy b{ display:block; font-size:6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.may-player-page .pc-song-copy span{ display:block; font-size:5px; color:#ac99ae; margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.may-player-page .laptop-base{ display:none; }
.may-player-page .player-device{
      position:absolute;
      width:min(238px,35%);
      aspect-ratio:832 / 1792;
      right:-2px;
      top:26px;
      padding:7px;
      border-radius:36px;
      background:linear-gradient(155deg,rgba(255,255,255,.38),rgba(255,255,255,.12) 18%,rgba(255,255,255,.035) 70%);
      border:1px solid rgba(255,255,255,.28);
      box-shadow:0 55px 115px rgba(0,0,0,.52),0 0 70px rgba(255,113,172,.19),inset 0 1px 1px rgba(255,255,255,.3);
      transform:rotate(0deg);
      z-index:4;
      transform-origin:center;
    }
.may-player-page .phone-screen{
      position:relative;
      width:100%;
      height:100%;
      overflow:hidden;
      border-radius:29px;
      background:
        radial-gradient(circle at 18% 17%,rgba(255,255,255,.26),transparent 25%),
        radial-gradient(circle at 82% 55%,rgba(255,255,255,.12),transparent 31%),
        linear-gradient(180deg,#efccd9 0%,#e9bfd0 56%,#e6b7ca 100%);
      border:1px solid rgba(255,255,255,.14);
      color:#4b2d39;
    }
.may-player-page .mobile-ui{
      position:absolute;
      inset:0;
      padding:10px 5px 13px;
      font-size:6px;
      display:flex;
      flex-direction:column;
    }
.may-player-page .m-header{
      padding:0px 5px;
      display:grid;
      grid-template-columns:30px 1fr 30px;
      align-items:center;
      gap:7px;
      flex:0 0 auto;
    }
.may-player-page .m-circle{
      width:25px;
      height:25px;
      border-radius:50%;
      background:rgba(255,250,252,.87);
      display:grid;
      place-items:center;
      box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 4px 12px rgba(103,58,76,.05);
      font-size:8px;
      font-weight:800;
    }
.may-player-page .m-title{ text-align:center;font-size:7px;font-weight:760;color:#9a687b; }
.may-player-page .m-album-wrap{ position:relative;width:64%;margin:16px auto 8px;flex:0 0 auto; }
.may-player-page .m-album{
      aspect-ratio:1;
      border-radius:19px;
      overflow:hidden;
      position:relative;
      background:
        radial-gradient(circle at 75% 23%, rgb(211 77 127 / 82%), transparent 20%),
        radial-gradient(circle at 28% 62%,rgba(96,59,132,.84),transparent 28%),
        linear-gradient(135deg,#291f2d,#693d5b 48%,#a55877 100%);
      box-shadow:0 12px 28px rgba(100,46,70,.18);
    }
.may-player-page .m-album::before{ content:"MayPlayer";position:absolute;left:23px;top:39%;font-size:15px;font-weight:950;font-style:italic;color:#ffffff;letter-spacing:-.07em;transform:skew(-8deg);text-shadow:0 1px 1px rgba(0,0,0,.42); }
.may-player-page .m-album::after{ content:"";position:absolute;left:31px;top:55%;font-size:6px;font-family:Georgia,serif;font-style:italic;color:#e7d178; }
.may-player-page .m-heart{ position:absolute;left:6px;bottom:6px;width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:rgba(75,59,85,.74);color:#ef4a94;font-size:13px; }
.may-player-page .m-track{ text-align:center;flex:0 0 auto; }
.may-player-page .m-track b{ display:block;font-size:11px;letter-spacing:-.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.may-player-page .m-track span{ display:block;margin-top:2px;color:#9c6e80;font-size:7px; }
.may-player-page .m-progress{ margin:10px 4px 0;flex:0 0 auto; }
.may-player-page .m-line{ height:2px;border-radius:4px;background:rgba(122,80,97,.12);position:relative; }
.may-player-page .m-line i{ display:block;width:28%;height:100%;background:#ee4b96;border-radius:inherit; }
.may-player-page .m-line i::after{ content:"";position:absolute;left:28%;top:50%;width:7px;height:7px;border-radius:50%;background:#ee4b96;transform:translate(-50%,-50%); }
.may-player-page .m-time{ display:flex;justify-content:space-between;margin-top:5px;color:#9c7382;font-size:6px; }
.may-player-page .m-lower{
      display:grid;
      grid-template-columns:100px minmax(0,1fr);
      gap:6px;
      margin-top:8px;
      align-items:start;
      flex:0 0 auto;
    }
.may-player-page .m-controls{
      position:relative;
      width:100px;
      height:156px;
      justify-self:center;
    }
.may-player-page .m-controls .m-circle{
      position:absolute;
      width:28px;
      height:28px;
      font-size:8px;
      margin:0;
    }
.may-player-page .m-controls .repeat{ left:0;  top:0; }
.may-player-page .m-controls .list{ left:32px; top:0; }
.may-player-page .m-controls .prev{ left:61px; top:12px; }
.may-player-page .m-controls .nextbtn{ left:74px; top:42px; }
.may-player-page .m-controls .volume{ left:74px; top:73px; }
.may-player-page .m-controls .forward{ left:61px; top:105px; }
.may-player-page .m-controls .back{ left:32px; top:120px; }
.may-player-page .m-controls .search{ left:0;  top:120px; }
.may-player-page .m-controls .play{
      left:12px;
      top:48px;
      width:48px;
      height:48px;
      border-radius:50%;
      background:#ef4b99;
      color:white;
      font-size:15px;
      box-shadow:0 7px 18px rgba(239,75,153,.16);
      z-index:2;
    }
.may-player-page .m-next{ min-width:0;padding-top:1px; margin-left: 5px;}
.may-player-page .m-next-label{ text-transform:uppercase;letter-spacing:.13em;font-weight:800;color:#9e6e80;margin:1px 0 6px;font-size:6px; }
.may-player-page .m-next-card{ height:31px;border-radius:12px;background:rgba(255,249,251,.76);display:flex;align-items:center;gap:6px;padding:4px 6px;margin-bottom:5px;box-shadow:inset 0 1px 0 rgba(255,255,255,.42); }
.may-player-page .m-next-cover{ width:24px;height:24px;border-radius:7px;flex:0 0 auto;background:linear-gradient(135deg,#171119,#d58cae); }
.may-player-page .m-next-card:nth-child(3) .m-next-cover{ background:linear-gradient(135deg,#e0d7eb,#6b347d 45%,#170b20); }
.may-player-page .m-next-card:nth-child(4) .m-next-cover{ background:linear-gradient(135deg,#ffd94d,#ff62a8 55%,#7f47ff); }
.may-player-page .m-next-text{ min-width:0; }
.may-player-page .m-next-text b{ display:block;font-size:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.may-player-page .m-next-text span{ display:block;color:#a87788;font-size:5px;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.may-player-page .m-order{ margin:5px 0 0 auto;width:55px;height:15px;border-radius:12px;background:rgba(255,249,251,.76);display:flex;align-items:center;justify-content:center;color:#9b7080;font-size:6px; }
.may-player-page .m-speaker{ display:flex;justify-content:space-between;align-items:center;flex:0 0 auto; padding: 0px 6px; }
.may-player-page .m-output{ height:18px;min-width:90px;padding:0 10px;border-radius:14px;background:rgba(255,249,251,.76);display:flex;align-items:center;gap:5px;color:#9a687b;font-size:7px; }
.may-player-page .m-bottom-pill{ position:absolute;left:50%;bottom:13px;transform:translateX(-50%);width:25px;height:10px;border-radius:13px;background:rgba(255,249,251,.78);display:grid;place-items:center;color:#9a687b;font-size:6px; }
.may-player-page .m-navbar{ position:absolute;left:50%;bottom:4px;width:76px;height:3px;border-radius:4px;background:rgba(95,65,78,.47);transform:translateX(-50%); }
.may-player-page .platform-chip{ position:absolute;z-index:7;display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.11);background:rgba(9,10,13,.73);backdrop-filter:blur(20px) saturate(145%);color:#e5e7ec;font-size:10px;font-weight:800;box-shadow:0 16px 45px rgba(0,0,0,.28);white-space:nowrap; }
.may-player-page .platform-chip::before{ content:"";width:7px;height:7px;border-radius:50%;background:var(--pink);box-shadow:0 0 13px rgba(255,62,158,.72); }
.may-player-page .platform-chip.pc{ left:28px;top:106px; }
.may-player-page .platform-chip.mobile{ right:11px;top:-15px; }
.may-player-page .device-note{ position:absolute;z-index:6;left:56px;bottom:66px;display:flex;align-items:center;gap:10px;padding:10px 13px;max-width:290px;border-radius:16px;border:1px solid rgba(255,255,255,.09);background:rgba(13,13,18,.62);backdrop-filter:blur(18px);color:#858b96;font-size:10px;line-height:1.35;box-shadow:0 18px 50px rgba(0,0,0,.22); }
.may-player-page .device-note strong{ color:#f5f6f8;font-size:11px; }
.may-player-page .device-note-icon{ width:32px;height:32px;flex:0 0 auto;border-radius:10px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(255,62,158,.20),rgba(143,98,255,.16));border:1px solid rgba(255,255,255,.08); }
.may-player-page .device-note-icon svg{ width:16px; }
@media (max-width: 640px){.may-player-page .pc-ui{ grid-template-columns:84px 1fr; font-size:5px; }
.may-player-page .pc-sidebar{ padding:8px 5px; }
.may-player-page .pc-brand{ font-size:6px; margin-bottom:8px; }
.may-player-page .pc-brand-badge{ width:12px;height:12px;font-size:6px;border-radius:4px; }
.may-player-page .pc-section{ font-size:3.5px; margin:5px 3px 3px; }
.may-player-page .pc-nav-item{ height:15px;gap:4px;padding:0 4px;border-radius:5px; }
.may-player-page .pc-nav-item .ico{ width:8px;font-size:5px; }
.may-player-page .pc-topbar{ height:24px;padding:0 8px;gap:4px; }
.may-player-page .pc-round{ width:13px;height:13px;font-size:5px; }
.may-player-page .pc-page-title{ font-size:6px; }
.may-player-page .pc-timer{ display:none; }
.may-player-page .pc-search{ width:92px;height:14px;font-size:4px;padding:0 5px; }
.may-player-page .pc-window{ font-size:4px;letter-spacing:4px; }
.may-player-page .pc-main{ top:24px;padding:24px 18px 8px 34px; }
.may-player-page .pc-now{ grid-template-columns:106px 1fr;gap:13px; }
.may-player-page .pc-album{ width:106px; }
.may-player-page .pc-album::before{ font-size:18px;left:6px;bottom:5px; }
.may-player-page .pc-album::after{ font-size:6px;right:7px;top:8px; }
.may-player-page .pc-track h4{ font-size:7px;margin-bottom:3px; }
.may-player-page .pc-track p{ font-size:4px;margin-bottom:5px; }
.may-player-page .pc-badge{ font-size:3px;padding:2px 4px; }
.may-player-page .pc-actions{ gap:7px;font-size:6px; }
.may-player-page .pc-progress-wrap{ margin-top:9px; }
.may-player-page .pc-controls-row{ margin-top:4px;gap:10px;font-size:5px; }
.may-player-page .pc-play{ width:18px;height:18px;font-size:6px; }
.may-player-page .pc-volume{ width:75px;margin-top:3px; }
.may-player-page .pc-next{ margin-top:11px; }
.may-player-page .pc-next-grid{ gap:4px; }
.may-player-page .pc-song-card{ height:24px;border-radius:6px;padding:3px 4px;gap:4px; }
.may-player-page .pc-song-cover{ width:16px;height:16px;border-radius:4px; }
.may-player-page .pc-song-copy b{ font-size:3.8px; }
.may-player-page .pc-song-copy span{ font-size:3.2px; }
.may-player-page .mobile-ui{ padding:9px 6px 8px;font-size:4px; }
.may-player-page .m-header{ grid-template-columns:20px 1fr 20px; }
.may-player-page .m-circle{ width:20px;height:20px;font-size:7px; }
.may-player-page .m-title{ font-size:5px; }
.may-player-page .m-album-wrap{ width:64%; margin:9px auto 4px; }
.may-player-page .m-album{ border-radius:12px; }
.may-player-page .m-album::before{ font-size:10px;left:5px; }
.may-player-page .m-album::after{ font-size:4px;left:22px; }
.may-player-page .m-heart{ width:19px;height:19px;font-size:9px; }
.may-player-page .m-track b{ font-size:7px; }
.may-player-page .m-track span{ font-size:4px; }
.may-player-page .m-progress{ margin-top:5px; }
.may-player-page .m-lower{ grid-template-columns:64px minmax(0,1fr);gap:3px;margin-top:4px; }
.may-player-page .m-controls{ width:64px;height:100px; }
.may-player-page .m-controls .m-circle{ width:19px;height:19px;font-size:5px; }
.may-player-page .m-controls .repeat{ left:0;top:0; }
.may-player-page .m-controls .list{ left:22px;top:0; }
.may-player-page .m-controls .prev{ left:44px;top:9px; }
.may-player-page .m-controls .nextbtn{ left:47px;top:30px; }
.may-player-page .m-controls .volume{ left:47px;top:53px; }
.may-player-page .m-controls .forward{ left:44px;top:75px; }
.may-player-page .m-controls .back{ left:22px;top:82px; }
.may-player-page .m-controls .search{ left:0;top:82px; }
.may-player-page .m-controls .play{ left:17px;top:34px;width:31px;height:31px;font-size:9px; }
.may-player-page .m-next-card{ height:20px;border-radius:8px;padding:2px 3px;gap:3px;margin-bottom:3px; }
.may-player-page .m-next-cover{ width:15px;height:15px;border-radius:4px; }
.may-player-page .m-next-text b{ font-size:3.8px; }
.may-player-page .m-next-text span{ font-size:3.2px; }
.may-player-page .m-order{ width:46px;height:15px;font-size:4px; }
.may-player-page .m-speaker{ margin-top:5px; }
.may-player-page .m-output{ height:16px;min-width:71px;padding:0 5px;font-size:4px; }
.may-player-page .m-bottom-pill{ width:29px;height:12px;bottom:6px;font-size:6px; }

    }
.may-player-page .strip{
      position:relative;
      width:100%;
      max-width:100vw;
      height:47px;
      border-top:1px solid var(--line);
      border-bottom:1px solid var(--line);
      background:rgba(255,255,255,.018);
      overflow:hidden;
      contain:paint;
    }
.may-player-page .ticker{
      --ticker-distance: 1200px;
      --ticker-duration: 28s;
      position:absolute;
      left:0;
      top:0;
      display:flex;
      width:max-content;
      height:100%;
      will-change:transform;
      animation:ticker var(--ticker-duration) linear infinite;
    }
.may-player-page .ticker-group{
      height:100%;
      flex:0 0 auto;
      display:flex;
      align-items:center;
      justify-content:flex-start;
      gap:clamp(34px, 3.2vw, 62px);
      padding-right:clamp(34px, 3.2vw, 62px);
      color:#777d87;
      font-size:11px;
      font-weight:750;
      letter-spacing:.14em;
      text-transform:uppercase;
      white-space:nowrap;
    }
.may-player-page .ticker-group span{ flex:0 0 auto; }
.may-player-page .ticker-group span::before{ content:"✦"; color:var(--pink); margin-right:18px; }
@keyframes ticker{
      from { transform:translate3d(0,0,0); }
      to   { transform:translate3d(calc(-1 * var(--ticker-distance)),0,0); }
    }
.may-player-page section{ padding:108px 0; }
.may-player-page .section-head{ display:grid; grid-template-columns: .85fr 1.15fr; gap:42px; align-items:end; margin-bottom:48px; }
.may-player-page .section-kicker{ color:#808691; font-size:11px; text-transform:uppercase; letter-spacing:.16em; font-weight:800; }
.may-player-page h2{ font-size:clamp(42px, 6vw, 76px); line-height:.96; letter-spacing:-.06em; margin:8px 0 0; max-width:780px; }
.may-player-page .section-desc{ color:#979ca7; line-height:1.65; font-size:16px; max-width:570px; justify-self:end; }
.may-player-page .feature-grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:14px; }
.may-player-page .feature{
      min-height:250px; padding:28px;
      border:1px solid var(--line);
      border-radius:var(--radius);
      background:linear-gradient(155deg, rgba(255,255,255,.065), rgba(255,255,255,.025));
      position:relative; overflow:hidden;
      transition:transform .25s ease, border-color .25s ease;
    }
.may-player-page .feature:hover{ transform:translateY(-4px); border-color:rgba(255,255,255,.18); }
.may-player-page .feature.big{ grid-column:span 7; min-height:390px; display:grid; grid-template-columns:minmax(0,1fr) minmax(230px,.82fr); gap:26px; align-items:end; }
.may-player-page .feature.tall{ grid-column:span 5; min-height:390px; display:grid; grid-template-rows:auto 1fr; }
.may-player-page .feature.small{ grid-column:span 4; min-height:270px; }
.may-player-page .feature h3{ font-size:24px; letter-spacing:-.035em; margin:0 0 9px; }
.may-player-page .feature p{ color:#8e949e; line-height:1.55; max-width:440px; margin:0; }
.may-player-page .feature-copy{ position:relative; z-index:2; align-self:start; }
.may-player-page .feature-visual{ position:relative; min-width:0; min-height:210px; align-self:end; z-index:1; }
.may-player-page .feature-icon{ width:45px; height:45px; border-radius:14px; display:grid; place-items:center; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.07); margin-bottom:30px; }
.may-player-page .feature-icon svg{ width:22px; }
.may-player-page .feature .glow{ position:absolute; width:210px; height:210px; border-radius:50%; filter:blur(35px); opacity:.16; right:-70px; bottom:-90px; background:var(--pink); }
.may-player-page .feature.big .mini-ui{ position:relative; width:100%; min-width:0; height:220px; border-radius:24px; border:1px solid rgba(255,255,255,.09); background:#0f1115; padding:17px; transform:rotate(-.5deg); box-shadow:var(--shadow); }
.may-player-page .playlist-row{ height:40px; display:flex; align-items:center; gap:10px; border-bottom:1px solid rgba(255,255,255,.055); font-size:10px; color:#8b909a; }
.may-player-page .cover-sm{ width:27px; height:27px; border-radius:7px; background:linear-gradient(135deg,#ff4da6,#774aff); flex:0 0 auto; }
.may-player-page .playlist-row:nth-child(2) .cover-sm{background:linear-gradient(135deg,#ffcf68,#ff667d)}
.may-player-page .playlist-row:nth-child(3) .cover-sm{background:linear-gradient(135deg,#65d7ff,#5f70ff)}
.may-player-page .playlist-row:nth-child(4) .cover-sm{background:linear-gradient(135deg,#d5ff6f,#43b779)}
.may-player-page .orb{ position:absolute; width:min(180px, 78%); aspect-ratio:1; border-radius:50%; left:50%; bottom:0; transform:translateX(-50%); background:radial-gradient(circle at 35% 25%, #ffa6d1, #ff3f9f 25%, #7e48ff 67%, #151222 68%); box-shadow:0 30px 80px rgba(179,61,255,.25); }
.may-player-page .orb::before,
.may-player-page .orb::after{ content:""; position:absolute; inset:20%; border:1px solid rgba(255,255,255,.18); border-radius:50%; }
.may-player-page .orb::after{ inset:36%; }
.may-player-page .platforms{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.may-player-page .download-card{
      position:relative; overflow:hidden; min-height:360px; padding:34px;
      border-radius:32px; border:1px solid var(--line);
      background:linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.028));
      display:flex; flex-direction:column; justify-content:space-between;
    }
.may-player-page .download-card::after{ content:""; position:absolute; width:290px; height:290px; border-radius:50%; right:-100px; top:-100px; background:radial-gradient(circle, rgba(255,62,158,.22), transparent 68%); }
.may-player-page .download-card.windows::after{ background:radial-gradient(circle, rgba(106,118,255,.18), transparent 68%); }
.may-player-page .platform-top{ position:relative; z-index:1; }
.may-player-page .platform-icon{ width:58px; height:58px; border-radius:18px; display:grid; place-items:center; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.08); margin-bottom:30px; }
.may-player-page .platform-icon svg{ width:29px; }
.may-player-page .download-card h3{ font-size:34px; letter-spacing:-.045em; margin:0 0 9px; }
.may-player-page .download-card p{ color:#8f949e; max-width:460px; line-height:1.55; margin:0; }
.may-player-page .download-bottom{ position:relative; z-index:1; display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.may-player-page .tag{ padding:9px 12px; border-radius:999px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.07); color:#858b96; font-size:11px; }
.may-player-page .cta{
      position:relative; overflow:hidden;
      min-height:410px;
      display:grid; place-items:center; text-align:center;
      border:1px solid rgba(255,255,255,.12);
      border-radius:40px;
      padding:54px 24px;
      background:
        radial-gradient(circle at 50% 118%, rgba(255,62,158,.26), transparent 38%),
        linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.025));
    }
.may-player-page .cta::before{ content:"MAY PLAYER"; position:absolute; font-size:clamp(80px, 15vw, 190px); font-weight:950; letter-spacing:-.09em; color:rgba(255,255,255,.025); white-space:nowrap; top:50%; left:50%; transform:translate(-50%,-50%); }
.may-player-page .cta-inner{ position:relative; z-index:1; }
.may-player-page .cta h2{ margin:0 auto 16px; max-width:830px; }
.may-player-page .cta p{ color:#9aa0aa; max-width:570px; margin:0 auto; line-height:1.6; }
.may-player-page .cta .hero-actions{ justify-content:center; margin:0; }
.may-player-page footer{
      margin-top:28px;
      padding:28px 0 38px;
      color:#707681;
      background:#000;
      border-top:1px solid rgba(255,255,255,.08);
      box-shadow:0 -18px 50px rgba(0,0,0,.28);
    }
.may-player-page .footer-inner{
      display:flex;
      justify-content:space-between;
      gap:20px;
      align-items:center;
      font-size:12px;
    }
.may-player-page .footer-inner a:hover{ color:#fff; }
.may-player-page .reveal{ opacity:0; transform:translateY(24px); transition:opacity .75s ease, transform .75s cubic-bezier(.2,.7,.2,1); }
.may-player-page .reveal.visible{ opacity:1; transform:none; }
@media (max-width: 1180px){
    }
@media (max-width: 980px){.may-player-page .hero{ grid-template-columns:1fr; padding-top:86px; gap:24px; }
.may-player-page .hero-copy{ text-align:center; }
.may-player-page .lead{ margin-left:auto; margin-right:auto; }
.may-player-page .hero-actions,
.may-player-page .micro{ justify-content:center; }
.may-player-page .visual-stage{ min-height:620px; margin-top:8px; }
.may-player-page .hero-devices{ width:min(720px, 94vw); }
.may-player-page .section-head{ grid-template-columns:1fr; }
.may-player-page .section-desc{ justify-self:start; }
.may-player-page .feature.big,
.may-player-page .feature.tall{ grid-column:span 12; }
.may-player-page .feature.big{ grid-template-columns:minmax(0,1fr) minmax(230px,.8fr); }
.may-player-page .feature.small{ grid-column:span 6; }
.may-player-page .platforms{ grid-template-columns:1fr; }

    }
@media (max-width: 640px){.may-player-page .wrap{ width:min(100% - 24px, var(--max)); }
.may-player-page .hero{ min-height:auto; padding:62px 0 42px; gap:18px; }
.may-player-page h1{ font-size:clamp(52px, 19vw, 82px); }
.may-player-page .lead{ font-size:15px; }
.may-player-page .hero-actions{ display:grid; grid-template-columns:1fr; }
.may-player-page .btn{ width:100%; }
.may-player-page .visual-stage{ min-height:455px; margin:0 -8px -18px; }
.may-player-page .hero-devices{ width:100%; height:445px; }
.may-player-page .halo{ width:440px; height:440px; }
.may-player-page .desktop-device{ width:91%; left:-2%; top:132px; padding:6px; border-radius:16px; transform:rotate(-.5deg); }
.may-player-page .desktop-screen{ border-radius:11px; }
.may-player-page .laptop-base{ height:11px; bottom:-13px; }
.may-player-page .player-device{ width:142px; right:-1px; top:30px; padding:5px; border-radius:24px; transform:rotate(0deg); }
.may-player-page .phone-screen{ border-radius:19px; }
.may-player-page .platform-chip{ font-size:7px; padding:6px 8px; }
.may-player-page .platform-chip.pc{ left:4px; top:99px; }
.may-player-page .platform-chip.mobile{ right:2px; top:3px; }
.may-player-page .device-note{ left:12px; bottom:16px; max-width:230px; padding:8px 10px; font-size:8px; border-radius:12px; }
.may-player-page .device-note strong{ font-size:9px; }
.may-player-page .device-note-icon{ width:26px; height:26px; border-radius:8px; }
.may-player-page section{ padding:76px 0; }
.may-player-page .feature.small{ grid-column:span 12; }
.may-player-page .feature.big{ grid-template-columns:1fr; gap:18px; }
.may-player-page .feature.big .mini-ui{ height:180px; transform:none; }
.may-player-page .feature.tall .feature-visual{ min-height:180px; }
.may-player-page .feature p,
.may-player-page .feature.big p{ max-width:none; }
.may-player-page .download-card{ min-height:330px; padding:27px; }
.may-player-page .footer-inner{ align-items:flex-start; flex-direction:column; }

    }
@media (prefers-reduced-motion: reduce){.may-player-page *{ scroll-behavior:auto !important; animation:none !important; transition:none !important; }
.may-player-page .reveal{ opacity:1; transform:none; }

    }

  
.may-player-page { background: #000; display: block; }
.may-player-page::before, .may-player-page::after { display: none; }

/* Match the surrounding site while retaining the player illustrations. */
.may-player-page .feature, .may-player-page .download-card, .may-player-page .cta { background: #000; border-color: #303039; }
.may-player-page .hero-copy h1, .may-player-page .section-head h2, .may-player-page .feature h3, .may-player-page .download-card h3 { text-align: left; }
.may-player-page .hero-actions { justify-content: flex-start; }
.may-player-page .hero-copy h1 { font-size: clamp(54px,6vw,86px); line-height: 1; }
.may-player-page .hero-copy .eyebrow { text-transform: uppercase; }
.may-player-page .feature p, .may-player-page .download-card p, .may-player-page .cta p { font-size: 15px; }
@media (max-width:980px) {
 .may-player-page .hero-copy h1 { text-align: center; }
 .may-player-page .hero-actions { justify-content: center; }
}
@media (max-width:640px) { .may-player-page .hero-copy h1 { font-size: clamp(48px,15vw,76px); } }

/* Rating belongs to the device presentation, above the Windows preview. */
.may-player-page .visual-stage>.player-rating-row{position:absolute;left:0;top:-36px;margin:0;z-index:12;align-self:start}.may-player-page .visual-stage>.player-rating-row .project-rating-aside{width:220px;flex-basis:220px}.may-player-page .visual-stage>.player-rating-row .project-rating-summary{padding:12px}.may-player-page .visual-stage>.player-rating-row .project-rating-overview>strong{font-size:24px}.may-player-page .visual-stage>.player-rating-row .project-rating-form{max-width:calc(100vw - 40px)}
@media(max-width:980px){.may-player-page .visual-stage{display:flex;flex-direction:column;justify-content:center}.may-player-page .visual-stage>.player-rating-row{position:relative;top:auto;left:auto;align-self:center;margin:0 0 26px}.may-player-page .hero-devices{flex:none}.may-player-page .visual-stage>.player-rating-row .project-rating-form{position:static;width:100%;margin-top:10px}}

.may-player-page .player-discussions{background:transparent;padding:52px 0 80px}.may-player-page .player-discussions .project-comments{padding:0;margin-top:0!important}.may-player-page .player-discussions .page-container{max-width:1244px}.may-player-page .player-discussions .comment-field textarea{font-family:CenturyGothic,Arial,sans-serif}

.may-player-page .player-discussions{font-family:CenturyGothic,Arial,sans-serif}.may-player-page .comments-heading h2{font-size:clamp(24px,3vw,32px);line-height:1.3;letter-spacing:normal;max-width:none;margin:0 0 12px;font-weight:400}.may-player-page .comments-heading .eyebrow{padding:0;border:0;border-radius:0;background:none;box-shadow:none;margin:0 0 10px;font-size:11px;letter-spacing:.12em}.may-player-page .comments-heading .eyebrow::before{display:none}
.may-player-page .project-rating-counters{flex-wrap:wrap}.may-player-page .project-downloads{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;font-size:11px;line-height:1.6;font-variant-numeric:tabular-nums;color:var(--site-tone-b5a7ba,#baa7a9)}.may-player-page .project-downloads svg{width:17px;height:17px;flex:none;color:var(--site-tone-ab92b0,#b09295)}
