* {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    body {
      color: white;
      font-family: 'Geist', system-ui, -apple-system, sans-serif;
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      transition: background-color 0.3s, color 0.3s;
    }

    /* === ТЕМЫ === */
    body.theme-black { background-color: #000; color: white; }
    body.theme-white { background-color: #ffffff; color: #000000; }
    body.theme-olive { background-color: #3b3b1c; color: #f0f0e0; }
    body.theme-russia { 
      background: linear-gradient(to bottom, #ffffff 33%, #0039a6 33%, #0039a6 66%, #d52b1e 66%);
      color: white;
    }
    body.theme-purple { background-color: #2d1b3e; color: #e6d7f5; }

    /* Top bar */
    .top-bar {
      position: sticky;
      top: 0;
      z-index: 100;
      backdrop-filter: blur(10px);
      padding: 0.75rem 1.5rem;
      display: flex;
      align-items: center;
      justify-content: space-between;
      transition: background 0.3s, border-color 0.3s;
    }

    body.theme-black .top-bar { background: rgba(0, 0, 0, 0.8); border-bottom: 1px solid rgba(192, 132, 252, 0.2); }
    body.theme-white .top-bar { background: rgba(255, 255, 255, 0.8); border-bottom: 1px solid rgba(0, 0, 0, 0.1); color: black; }
    body.theme-olive .top-bar { background: rgba(59, 59, 28, 0.8); border-bottom: 1px solid rgba(150, 150, 100, 0.3); }
    body.theme-russia .top-bar { background: rgba(255, 255, 255, 0.7); border-bottom: 1px solid rgba(0, 0, 0, 0.2); color: black; }
    body.theme-purple .top-bar { background: rgba(45, 27, 62, 0.8); border-bottom: 1px solid rgba(192, 132, 252, 0.3); }

    .logo {
      font-size: 1.5rem;
      font-weight: 700;
      white-space: nowrap;
      transition: background 0.3s, -webkit-background-clip 0.3s;
    }

    body.theme-black .logo { background: linear-gradient(to right, #ec4899, #8b5cf6); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
    body.theme-white .logo { background: linear-gradient(to right, #8b5cf6, #ec4899); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
    body.theme-olive .logo { background: linear-gradient(to right, #a89f68, #c2b580); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
    body.theme-russia .logo { background: linear-gradient(to right, #0039a6, #d52b1e); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
    body.theme-purple .logo { background: linear-gradient(to right, #c084fc, #a855f7); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

    .player-btn, .theme-btn {
      width: 44px;
      height: 44px;
      border: none;
      border-radius: 50%;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: transform 0.2s, background 0.3s;
      margin-left: 0.5rem;
    }

    body.theme-black .player-btn { background: linear-gradient(to right, #ec4899, #8b5cf6); color: white; }
    body.theme-white .player-btn { background: linear-gradient(to right, #8b5cf6, #ec4899); color: white; }
    body.theme-olive .player-btn { background: linear-gradient(to right, #8a7f4a, #a89f68); color: white; }
    body.theme-russia .player-btn { background: linear-gradient(to right, #0039a6, #d52b1e); color: white; }
    body.theme-purple .player-btn { background: linear-gradient(to right, #c084fc, #a855f7); color: white; }

    body.theme-black .theme-btn { background: rgba(255, 255, 255, 0.1); color: white; }
    body.theme-white .theme-btn { background: rgba(0, 0, 0, 0.1); color: black; }
    body.theme-olive .theme-btn { background: rgba(200, 190, 140, 0.2); color: #f0f0e0; }
    body.theme-russia .theme-btn { background: rgba(0, 0, 0, 0.1); color: black; }
    body.theme-purple .theme-btn { background: rgba(200, 150, 255, 0.2); color: #e6d7f5; }

    .player-btn:hover, .theme-btn:hover {
      transform: scale(1.1);
    }

    /* Main content */
    .main {
      flex: 1;
      overflow-y: auto;
      padding: 4rem 1.5rem 2rem;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .main::before {
      content: '';
      position: absolute;
      inset: 0;
      z-index: 0;
      transition: background 0.5s;
    }

    body.theme-black .main::before { background: linear-gradient(to bottom right, #000, rgba(139, 92, 246, 0.2), #000); }
    body.theme-white .main::before { background: linear-gradient(to bottom right, #ffffff, rgba(139, 92, 246, 0.1), #f8f8f8); }
    body.theme-olive .main::before { background: linear-gradient(to bottom right, #3b3b1c, rgba(168, 159, 104, 0.2), #2a2a15); }
    body.theme-russia .main::before { background: linear-gradient(to bottom right, rgba(255,255,255,0.9), rgba(0,57,166,0.1), rgba(213,43,30,0.1)); }
    body.theme-purple .main::before { background: linear-gradient(to bottom right, #2d1b3e, rgba(168, 85, 247, 0.2), #1a0f25); }

    .content {
      position: relative;
      z-index: 1;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 2.5rem;
    }

    .title {
      font-size: 2.5rem;
      line-height: 1.2;
      font-weight: 800;
      width: 300px;
      margin: 0 auto;
      letter-spacing: -0.02em;
    }

    @media (min-width: 768px) {
      .title {
        font-size: 3.5rem;
      }
    }

    body.theme-black .title span:nth-child(1) { background: linear-gradient(to right, #60a5fa, #3b82f6); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: block; }
    body.theme-black .title span:nth-child(2) { background: linear-gradient(to right, #f472b6, #a855f7); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: block; }

    body.theme-white .title span:nth-child(1) { background: linear-gradient(to right, #3b82f6, #60a5fa); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: block; }
    body.theme-white .title span:nth-child(2) { background: linear-gradient(to right, #a855f7, #f472b6); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: block; }

    body.theme-olive .title span:nth-child(1) { background: linear-gradient(to right, #a89f68, #c2b580); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: block; }
    body.theme-olive .title span:nth-child(2) { background: linear-gradient(to right, #c2b580, #d4c89a); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: block; }

    body.theme-russia .title span:nth-child(1) { background: linear-gradient(to right, #0039a6, #005fcc); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: block; }
    body.theme-russia .title span:nth-child(2) { background: linear-gradient(to right, #d52b1e, #e04d3b); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: block; }

    body.theme-purple .title span:nth-child(1) { background: linear-gradient(to right, #c084fc, #a855f7); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: block; }
    body.theme-purple .title span:nth-child(2) { background: linear-gradient(to right, #e8b4fe, #d8b4fe); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: block; }

    .widget-container {
      width: 300px;
    }

    /* Footer */
    .footer {
      position: sticky;
      bottom: 0;
      z-index: 100;
      padding: 1.25rem 1.5rem;
      text-align: center;
      min-height: 90px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      gap: 0.25rem;
      transition: background 0.3s, border-color 0.3s, color 0.3s;
    }

    body.theme-black .footer { background: #000; border-top: 1px solid rgba(192, 132, 252, 0.2); color: #9ca3af; }
    body.theme-white .footer { background: #ffffff; border-top: 1px solid rgba(0, 0, 0, 0.1); color: #6b7280; }
    body.theme-olive .footer { background: #3b3b1c; border-top: 1px solid rgba(150, 150, 100, 0.3); color: #d4c89a; }
    body.theme-russia .footer { background: #ffffff; border-top: 1px solid rgba(0, 0, 0, 0.2); color: #333; }
    body.theme-purple .footer { background: #2d1b3e; border-top: 1px solid rgba(192, 132, 252, 0.3); color: #d8b4fe; }

    .footer-info {
      font-size: 0.875rem;
      font-weight: 500;
      text-shadow: 0 0 4px rgba(139, 92, 246, 0.3);
    }

    body.theme-white .footer-info { text-shadow: 0 0 4px rgba(139, 92, 246, 0.2); }
    body.theme-russia .footer-info { text-shadow: 0 0 4px rgba(0, 0, 0, 0.2); }

    .vk-link {
      font-size: 0.875rem;
      font-weight: 500;
      text-decoration: none;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 0.3rem;
      transition: opacity 0.2s;
    }

    .vk-link:hover {
      opacity: 0.8;
    }

    body.theme-black .vk-link { color: #4f46e5; }
    body.theme-white .vk-link { color: #4f46e5; }
    body.theme-olive .vk-link { color: #a89f68; }
    body.theme-russia .vk-link { color: #0039a6; }
    body.theme-purple .vk-link { color: #c084fc; }
  body
{
   background-color: #FFFFFF;
   color: #000000;
   font-family: Arial;
   font-weight: normal;
   font-size: 16px;
   line-height: 1.1875;
   margin: 0;
   padding: 0;
}