:root {
      --milk-white: #FFFDFD;
      --vanilla-cream: #FFF9F5;
      --strawberry-milk: #FFEBF0;
      --strawberry-lace: #FFD6E0;
      --berry-sweet: #FF8DA1;
      --berry-deep: #FF6B8B;
      --champagne-light: #FFF3E2;
      --champagne-gold: #F6D5B0;
      --caramel-rose: #E5B887;
      --mocha-dark: #5E4047;
      --mocha-muted: #8F6D75;
    }

    * {
      box-sizing: border-box;
      user-select: none;
    }

    /* biar email/pin bisa disalin & dipakai di 2FA */
    input, textarea, [contenteditable="true"], .rush-acc, .rush-acc * {
      user-select: text !important;
      -webkit-user-select: text !important;
    }

    body {
      font-family: 'Quicksand', sans-serif;
      background-color: var(--milk-white);
      color: var(--mocha-dark);
      overflow-x: hidden;
    }

    h1, h2, h3, h4, .font-cute {
      font-family: 'Fredoka', sans-serif;
    }

    body.is-loading {
      overflow: hidden;
    }

    /* Cohesive Strawberry Milkshake & Vanilla Latte Background */
    .strawberry-bg {
      background-color: #FFFDFD;
      background-image: 
        radial-gradient(at 15% 12%, rgba(255, 214, 224, 0.65) 0px, transparent 48%),
        radial-gradient(at 85% 20%, rgba(255, 243, 226, 0.85) 0px, transparent 50%),
        radial-gradient(at 50% 60%, rgba(255, 235, 240, 0.6) 0px, transparent 55%),
        radial-gradient(at 80% 85%, rgba(246, 213, 176, 0.35) 0px, transparent 50%),
        radial-gradient(#FFD6E0 1.3px, transparent 1.3px);
      background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100%, 28px 28px;
    }

    /* Canvas Kelopak Sakura & Champagne Sparkles */
    #sakura-canvas {
      position: fixed;
      inset: 0;
      pointer-events: none;
      z-index: 25;
    }

    /* Cohesive Strawberry & Cream 3D Card */
    .dream-card {
      position: relative;
      background: rgba(255, 253, 253, 0.95);
      backdrop-filter: blur(12px);
      border: 3.5px solid var(--strawberry-lace);
      border-radius: 34px;
      box-shadow: 
        0 10px 0px var(--strawberry-lace),
        0 20px 35px -10px rgba(255, 107, 139, 0.16);
      transition: border-color 0.35s ease, box-shadow 0.35s ease, transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
      transform-style: preserve-3d;
    }

    .dream-card::after {
      content: "";
      position: absolute;
      inset: 7px;
      border: 2px dashed rgba(255, 141, 161, 0.42);
      border-radius: 26px;
      pointer-events: none;
    }

    .dream-card:hover {
      border-color: var(--berry-sweet);
      box-shadow: 
        0 14px 0px var(--berry-sweet),
        0 28px 45px -10px rgba(255, 107, 139, 0.28);
    }

    /* Squishy Strawberry & Champagne Button */
    .btn-dream {
      background: linear-gradient(135deg, #FF9EBB 0%, #FF6B8B 65%, #F3A683 100%);
      color: #FFFFFF;
      border: 3px solid #FFFFFF;
      box-shadow: 0 6px 0px #E05374, 0 12px 24px rgba(255, 107, 139, 0.35);
      transition: all 0.22s cubic-bezier(0.34, 1.56, 0.64, 1);
    }

    .btn-dream:hover {
      transform: scale(1.06) translateY(-3px);
      box-shadow: 0 9px 0px #E05374, 0 18px 28px rgba(255, 107, 139, 0.45);
    }

    .btn-dream:active {
      transform: scale(0.96) translateY(4px);
      box-shadow: 0 2px 0px #E05374;
    }

    /* Vanilla Cream Pill Button */
    .btn-pastel {
      background: #FFFFFF;
      color: var(--mocha-dark);
      border: 2.5px solid var(--strawberry-lace);
      box-shadow: 0 5px 0px var(--strawberry-milk);
      transition: all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
    }

    .btn-pastel:hover, .btn-pastel.active {
      background: linear-gradient(135deg, #FF8DA1 0%, #FF6B8B 100%);
      color: #FFFFFF;
      border-color: #FFFFFF;
      box-shadow: 0 6px 0px #E05374, 0 10px 20px rgba(255, 107, 139, 0.3);
      transform: translateY(-3px);
    }

    /* Soundwave Animation inside Vinyl Player */
    @keyframes soundBar {
      0%, 100% { height: 5px; }
      50% { height: 18px; }
    }
    .wave-bar {
      width: 3.5px;
      border-radius: 99px;
      background: linear-gradient(to top, #FF6B8B, #E5B887);
      animation: soundBar 0.7s ease-in-out infinite;
    }
    .wave-bar.paused {
      animation-play-state: paused;
      height: 5px !important;
    }

    @keyframes spinSlow {
      0% { transform: rotate(0deg); }
      100% { transform: rotate(360deg); }
    }
    .spin-slow {
      animation: spinSlow 9s linear infinite;
    }
    .spin-paused {
      animation-play-state: paused !important;
    }

    @keyframes floatSoft {
      0%, 100% { transform: translateY(0px) rotate(-2deg); }
      50% { transform: translateY(-12px) rotate(3deg); }
    }
    .float-soft {
      animation: floatSoft 3.6s ease-in-out infinite;
    }

    @keyframes pulseHeart {
      0%, 100% { transform: scale(1); }
      50% { transform: scale(1.08); }
    }
    .heart-beat {
      animation: pulseHeart 2.2s ease-in-out infinite;
    }

    @keyframes marquee {
      0% { transform: translateX(0%); }
      100% { transform: translateX(-50%); }
    }
    .animate-marquee {
      display: flex;
      width: max-content;
      animation: marquee 28s linear infinite;
    }

    .cursor-trail {
      position: fixed;
      pointer-events: none;
      z-index: 9999;
    }

    /* Scroll tetap jalan, bilah scrollbar disembunyikan */
    html, body, * {
      scrollbar-width: none;
      -ms-overflow-style: none;
    }
    html::-webkit-scrollbar,
    body::-webkit-scrollbar,
    *::-webkit-scrollbar {
      width: 0 !important;
      height: 0 !important;
      display: none !important;
      background: transparent;
    }

    .fmt-md strong { font-weight: 800; color: inherit; }
    .fmt-md em { font-style: italic; color: inherit; }

    /* /ato & /reseller/ato — samakan rasa strawberry milk Joyland */
    body.kind.rush.strawberry-bg {
      background-color: #FFFDFD !important;
      background-image:
        radial-gradient(at 15% 12%, rgba(255, 214, 224, 0.65) 0px, transparent 48%),
        radial-gradient(at 85% 20%, rgba(255, 243, 226, 0.85) 0px, transparent 50%),
        radial-gradient(at 50% 60%, rgba(255, 235, 240, 0.6) 0px, transparent 55%),
        radial-gradient(at 80% 85%, rgba(246, 213, 176, 0.35) 0px, transparent 50%),
        radial-gradient(#FFD6E0 1.3px, transparent 1.3px) !important;
      background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100%, 28px 28px !important;
      color: var(--mocha-dark) !important;
      font-family: 'Quicksand', sans-serif !important;
    }
    body.kind.rush h1,
    body.kind.rush h2,
    body.kind.rush h3,
    body.kind.rush .prod-title h3,
    body.kind.rush .box h3,
    body.kind.rush .gate-box h2,
    body.kind.rush .check-card h2,
    body.kind.rush .k-brand b {
      font-family: 'Fredoka', sans-serif !important;
      font-weight: 600 !important;
      letter-spacing: 0 !important;
      color: var(--mocha-dark) !important;
    }
    body.kind.rush .k-nav {
      background: rgba(255, 253, 253, 0.92);
      border-bottom-color: var(--strawberry-lace);
    }
    body.kind.rush .k-brand { color: var(--berry-deep); }
    body.kind.rush .k-brand img {
      width: 44px; height: 44px; border-radius: 14px;
      border: 2px solid var(--strawberry-lace);
      object-fit: cover;
    }
    body.kind.rush .k-brand small { color: var(--mocha-muted); }
    body.kind.rush .k-links a.on,
    body.kind.rush .k-links a:hover { color: var(--berry-deep); }
    body.kind.rush #cats button.on,
    body.kind.rush .plus,
    body.kind.rush .buy,
    body.kind.rush .btn-send,
    body.kind.rush .check-row button {
      background: var(--berry-deep) !important;
      border-color: var(--berry-deep) !important;
      color: #fff !important;
    }
    body.kind.rush .tile {
      border: 2.5px solid var(--strawberry-lace);
      border-radius: 24px;
      box-shadow: 0 8px 0 var(--strawberry-lace);
      background: rgba(255, 253, 253, 0.96);
    }
    body.kind.rush .tile .shot {
      background: #FFF5F8;
      border-radius: 18px;
    }
    body.kind.rush .from,
    body.kind.rush .price,
    body.kind.rush .pay #payExact,
    body.kind.rush .done-box > b#orderCode {
      color: var(--berry-deep) !important;
    }
    body.kind.rush .check-card,
    body.kind.rush .dock {
      border-color: var(--strawberry-lace);
      box-shadow: 0 10px 28px rgba(255, 107, 139, 0.1);
    }
    body.kind.rush .sec-row {
      display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
      margin-bottom: 6px;
    }
    body.kind.rush .sec-row h2 { font-size: clamp(26px, 5vw, 36px); margin: 0; }
    body.kind.rush #secCount {
      color: var(--mocha-muted); font-size: 13px; font-weight: 600; white-space: nowrap;
    }
    body.kind.rush .lead { color: var(--mocha-muted); }
    body.kind.rush .search {
      border: 2px solid var(--strawberry-lace);
      border-radius: 999px;
      padding: 12px 16px;
      background: #fff;
    }
    body.kind.rush .empty {
      grid-column: 1 / -1; text-align: center; color: var(--mocha-muted); padding: 28px 12px;
    }
    body.kind.rush .empty img { width: 88px; height: 88px; object-fit: contain; margin-bottom: 8px; }
    body.kind.rush {
      padding-bottom: 110px !important;
    }
    body.kind.rush .k-products {
      padding-bottom: 24px;
    }
    body.kind.rush .dock {
      position: fixed !important;
      left: 12px; right: 12px; bottom: 12px;
      z-index: 40;
      background: rgba(255, 253, 253, 0.96);
      backdrop-filter: blur(10px);
    }
    body.kind.rush .dock a.on { color: var(--berry-deep) !important; }

    body.kind.rush .ato-sk {
      margin: 10px 0 12px;
      padding: 12px 14px;
      border: 2px solid var(--strawberry-lace);
      border-radius: 18px;
      background: #FFF7FA;
    }
    body.kind.rush .ato-sk b {
      display: block;
      font-family: 'Fredoka', sans-serif;
      font-size: 14px;
      color: var(--mocha-dark);
      margin-bottom: 8px;
    }
    body.kind.rush .ato-sk ul {
      margin: 0;
      padding-left: 18px;
      color: var(--mocha-muted);
      font-size: 13px;
      line-height: 1.55;
    }
    body.kind.rush .ato-sk li { margin: 4px 0; }
    body.kind.rush .ato-sk-agree {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      margin-top: 10px;
      font-size: 13px;
      font-weight: 600;
      color: var(--mocha-dark);
      cursor: pointer;
    }
    body.kind.rush .ato-sk-agree input {
      width: auto;
      margin-top: 2px;
      accent-color: var(--berry-deep);
    }
    body.kind.rush .prod-sk { text-align: left; margin: 0 0 14px; }
