@import url('https://fonts.googleapis.com/css2?family=Comic+Neue:wght@700&display=swap');
    body {
      margin: 0;
      padding: 0;
      font-family: 'Comic Neue', Comic Sans MS, cursive, sans-serif;
      background: linear-gradient(135deg, #ffec61 0%, #f32170 100%);
      color: #222;
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-start;
      overflow-x: hidden;
    }
    .container {
      width: 100%;
      max-width: 600px;
      margin: 32px auto 0 auto;
      padding: 16px;
      box-sizing: border-box;
      display: flex;
      flex-direction: column;
      align-items: center;
      background: rgba(255,255,255,0.85);
      border-radius: 24px;
      box-shadow: 0 8px 32px rgba(0,0,0,0.2);
      border: 4px dashed #f32170;
      position: relative;
      z-index: 1;
    }
    .title {
      font-size: 2.2em;
      font-weight: bold;
      margin-bottom: 0.2em;
      text-align: center;
      color: #f32170;
      text-shadow: 2px 2px 0 #fff, 4px 4px 0 #ffec61;
      animation: wiggle 1.2s infinite alternate;
    }
    @keyframes wiggle {
      0% { transform: rotate(-2deg) scale(1.05); }
      100% { transform: rotate(2deg) scale(1.1); }
    }
    .subtitle {
      font-size: 1.2em;
      margin-bottom: 18px;
      color: #222;
      text-align: center;
      background: #ffec61;
      border-radius: 12px;
      padding: 6px 12px;
      display: inline-block;
      box-shadow: 2px 2px 0 #f32170;
      animation: bounce 1.5s infinite alternate;
    }
    @keyframes bounce {
      0% { transform: translateY(0); }
      100% { transform: translateY(-10px); }
    }
    .video-wrapper {
      position: relative;
      z-index: 10;
      transform: translateZ(0);
      width: 100%;
      padding-bottom: 56.25%;
      height: 0;
      margin-bottom: 24px;
      border-radius: 16px;
      overflow: hidden;
      box-shadow: 0 4px 24px #f32170aa;
      border: 4px solid #ffec61;
      animation: shake 2s infinite alternate;
    }
    @keyframes shake {
      0% { transform: rotate(-1deg); }
      100% { transform: rotate(1deg); }
    }
    .video-wrapper iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      border: none;
    }
    .support {
      margin-top: 24px;
      text-align: center;
      font-size: 1.2em;
      color: #f32170;
      font-weight: bold;
      background: #fff3cd;
      border-radius: 12px;
      padding: 12px 18px;
      box-shadow: 2px 2px 0 #ffec61;
      position: relative;
      z-index: 2;
      animation: pop 1.2s infinite alternate;
    }
    @keyframes pop {
      0% { transform: scale(1); }
      100% { transform: scale(1.07); }
    }
    .kofi-link {
      display: inline-block;
      margin-top: 16px;
      padding: 14px 32px;
      background: linear-gradient(90deg, #29abe0 0%, #f32170 100%);
      color: #fff;
      border-radius: 16px;
      text-decoration: none;
      font-weight: bold;
      font-size: 1.2em;
      box-shadow: 0 2px 8px #f3217088;
      border: 2px solid #ffec61;
      transition: transform 0.2s, background 0.2s;
      animation: spin 2.5s linear infinite;
    }
    .kofi-link:hover {
      background: linear-gradient(90deg, #f32170 0%, #29abe0 100%);
      transform: scale(1.15) rotate(-2deg);
    }
    @keyframes spin {
      0% { filter: hue-rotate(0deg); }
      100% { filter: hue-rotate(360deg); }
    }
    
    .social-links {
      display: flex;
      justify-content: center;
      gap: 16px;
      margin: 16px 0 24px 0;
    }
    
    .social-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 50px;
      height: 50px;
      border-radius: 50%;
      text-decoration: none;
      transition: all 0.3s ease;
      box-shadow: 0 4px 12px rgba(0,0,0,0.2);
      border: 3px solid transparent;
    }
    
    .social-btn:hover {
      transform: scale(1.15) translateY(-3px);
      box-shadow: 0 8px 20px rgba(0,0,0,0.3);
      border-color: #ffec61;
    }
    
    .social-icon {
      width: 24px;
      height: 24px;
    }
    
    .instagram {
      background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
      color: white;
    }
    
    .instagram:hover {
      background: linear-gradient(45deg, #bc1888 0%, #cc2366 25%, #dc2743 50%, #e6683c 75%, #f09433 100%);
    }
    
    .tiktok {
      background: linear-gradient(45deg, #000000 0%, #25f4ee 50%, #fe2c55 100%);
      color: white;
    }
    
    .tiktok:hover {
      background: linear-gradient(45deg, #fe2c55 0%, #25f4ee 50%, #000000 100%);
    }
    
    .discord {
      background: linear-gradient(45deg, #5865f2 0%, #7289da 100%);
      color: white;
    }
    
    .discord:hover {
      background: linear-gradient(45deg, #7289da 0%, #5865f2 100%);
    }
    
    .emoji {
      font-size: 2.2em;
      margin: 0 0.2em;
      display: inline-block;
      animation: emoji-dance 1.5s infinite alternate;
    }
    @keyframes emoji-dance {
      0% { transform: translateY(0) rotate(-10deg); }
      100% { transform: translateY(-10px) rotate(10deg); }
    }
    @media (max-width: 600px) {
      .container {
        max-width: 100vw;
        padding: 8px 0;
      }
      .title { font-size: 1.3em; }
      .subtitle { font-size: 1em; }
      .support { font-size: 1em; }
      .kofi-link { font-size: 1em; padding: 10px 18px; }
      .social-links {
        gap: 12px;
        margin: 12px 0 20px 0;
      }
      .social-btn {
        width: 27px;
        height: 27px;
      }
      .social-icon { 
        width: 20px;
        height: 20px;
      }
      .video-wrapper {
        width: 100%;
        margin: 0 auto;
        border-radius: 0;
        border-left: none;
        border-right: none;
        max-width: 100vw;
        min-width: 0;
      }
      .video-wrapper iframe {
        border-radius: 0;
      }
    }