<svg xmlns="http://www.w3.org/2000/svg" width="390" height="844" viewBox="0 0 390 844">
  <defs>
    <linearGradient id="gC1" x1="0" y1="0" x2="1" y2="1"><stop offset="0%" stop-color="#00C8FF"/><stop offset="100%" stop-color="#0050A0"/></linearGradient>
    <linearGradient id="gC2" x1="0" y1="0" x2="1" y2="1"><stop offset="0%" stop-color="#7C3AED"/><stop offset="100%" stop-color="#4C1A9E"/></linearGradient>
    <linearGradient id="gC3" x1="0" y1="0" x2="1" y2="1"><stop offset="0%" stop-color="#00D181"/><stop offset="100%" stop-color="#007A4A"/></linearGradient>
    <linearGradient id="gC4" x1="0" y1="0" x2="1" y2="1"><stop offset="0%" stop-color="#FF9F0A"/><stop offset="100%" stop-color="#C05A00"/></linearGradient>
    <filter id="fs"><feDropShadow dx="0" dy="4" stdDeviation="8" flood-color="#000" flood-opacity="0.45"/></filter>
  </defs>
  <rect width="390" height="844" fill="#00060A"/>
  <!-- Status bar -->
  <text x="22" y="29" fill="white" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="15" font-weight="600" dominant-baseline="middle">9:41</text>
  <rect x="308" y="22" width="3" height="7" rx="1.2" fill="white"/><rect x="313" y="20" width="3" height="9" rx="1.2" fill="white"/><rect x="318" y="18" width="3" height="11" rx="1.2" fill="white"/><rect x="323" y="16" width="3" height="13" rx="1.2" fill="white"/>
  <path d="M332 24 Q337 19 342 24" fill="none" stroke="white" stroke-width="1.8" stroke-linecap="round"/><path d="M334 27 Q337 24 340 27" fill="none" stroke="white" stroke-width="1.8" stroke-linecap="round"/><circle cx="337" cy="30" r="1.5" fill="white"/>
  <rect x="350" y="19" width="22" height="11" rx="3" fill="none" stroke="rgba(255,255,255,0.4)" stroke-width="1.2"/><rect x="373" y="22" width="2" height="5" rx="1" fill="rgba(255,255,255,0.4)"/><rect x="352" y="21" width="16" height="7" rx="1.5" fill="#00C8FF"/>
  <!-- Header -->
  <text x="22" y="62" fill="white" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="26" font-weight="800" letter-spacing="-0.5">My Courses</text>
  <text x="22" y="84" fill="#3A6A7A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="13">12 enrolled · 3 completed</text>
  <!-- Search bar -->
  <rect x="16" y="98" width="358" height="40" rx="14" fill="#061220"/>
  <circle cx="38" cy="118" r="8" fill="none" stroke="#3A6A7A" stroke-width="1.8"/>
  <line x1="43" y1="123" x2="48" y2="128" stroke="#3A6A7A" stroke-width="1.8" stroke-linecap="round"/>
  <text x="58" y="122" fill="#2A4A5A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="14" dominant-baseline="middle">Search courses...</text>
  <!-- Filter tabs -->
  <rect x="16" y="150" width="72" height="28" rx="14" fill="#00C8FF" fill-opacity="0.2"/>
  <text x="52" y="168" fill="#00C8FF" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="12" font-weight="700" text-anchor="middle" dominant-baseline="middle">All (12)</text>
  <rect x="96" y="150" width="100" height="28" rx="14" fill="#061220"/>
  <text x="146" y="168" fill="#3A6A7A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="12" text-anchor="middle" dominant-baseline="middle">In Progress (9)</text>
  <rect x="204" y="150" width="102" height="28" rx="14" fill="#061220"/>
  <text x="255" y="168" fill="#3A6A7A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="12" text-anchor="middle" dominant-baseline="middle">Completed (3)</text>
  <!-- Course card 1 -->
  <rect x="16" y="192" width="358" height="96" rx="18" fill="#061220" filter="url(#fs)"/>
  <rect x="28" y="204" width="68" height="72" rx="14" fill="url(#gC1)"/>
  <rect x="36" y="226" width="52" height="24" rx="4" fill="rgba(255,255,255,0.2)"/><rect x="36" y="218" width="38" height="6" rx="3" fill="rgba(255,255,255,0.4)"/>
  <text x="108" y="220" fill="white" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="14" font-weight="700">UX Design Fundamentals</text>
  <text x="108" y="237" fill="#3A6A7A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="12">12 chapters · By Sarah K.</text>
  <rect x="108" y="252" width="230" height="4" rx="2" fill="#0A1A2A"/>
  <rect x="108" y="252" width="140" height="4" rx="2" fill="#00C8FF"/>
  <text x="108" y="272" fill="rgba(255,255,255,0.5)" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="11">61% complete</text>
  <text x="344" y="272" fill="#00C8FF" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="11" font-weight="600" text-anchor="end">Continue</text>
  <!-- Course card 2 -->
  <rect x="16" y="298" width="358" height="96" rx="18" fill="#061220" filter="url(#fs)"/>
  <rect x="28" y="310" width="68" height="72" rx="14" fill="url(#gC2)"/>
  <path d="M34 334 L62 318 L62 348 Z" fill="rgba(255,255,255,0.4)"/>
  <text x="108" y="326" fill="white" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="14" font-weight="700">Python for Beginners</text>
  <text x="108" y="343" fill="#3A6A7A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="12">20 chapters · By James T.</text>
  <rect x="108" y="358" width="230" height="4" rx="2" fill="#0A1A2A"/>
  <rect x="108" y="358" width="78" height="4" rx="2" fill="#7C3AED"/>
  <text x="108" y="378" fill="rgba(255,255,255,0.5)" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="11">34% complete</text>
  <text x="344" y="378" fill="#00C8FF" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="11" font-weight="600" text-anchor="end">Continue</text>
  <!-- Course card 3 -->
  <rect x="16" y="404" width="358" height="96" rx="18" fill="#061220" filter="url(#fs)"/>
  <rect x="28" y="416" width="68" height="72" rx="14" fill="url(#gC3)"/>
  <rect x="34" y="426" width="56" height="42" rx="4" fill="rgba(255,255,255,0.2)"/><line x1="38" y1="436" x2="84" y2="436" stroke="rgba(255,255,255,0.5)" stroke-width="1.5"/><line x1="38" y1="444" x2="80" y2="444" stroke="rgba(255,255,255,0.4)" stroke-width="1.5"/><line x1="38" y1="452" x2="74" y2="452" stroke="rgba(255,255,255,0.3)" stroke-width="1.5"/>
  <text x="108" y="432" fill="white" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="14" font-weight="700">Marketing Analytics</text>
  <text x="108" y="449" fill="#3A6A7A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="12">8 chapters · By Emily R.</text>
  <rect x="108" y="464" width="230" height="4" rx="2" fill="#0A1A2A"/>
  <rect x="108" y="464" width="28" height="4" rx="2" fill="#00D181"/>
  <text x="108" y="484" fill="rgba(255,255,255,0.5)" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="11">12% complete</text>
  <text x="344" y="484" fill="#00C8FF" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="11" font-weight="600" text-anchor="end">Continue</text>
  <!-- Course card 4 -->
  <rect x="16" y="510" width="358" height="96" rx="18" fill="#061220" filter="url(#fs)"/>
  <rect x="28" y="522" width="68" height="72" rx="14" fill="url(#gC4)"/>
  <circle cx="62" cy="540" r="12" fill="rgba(255,255,255,0.3)"/><circle cx="62" cy="540" r="5" fill="rgba(255,255,255,0.6)"/>
  <path d="M34 570 L50 558 L60 564 L78 550 L96 570" fill="none" stroke="rgba(255,255,255,0.5)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
  <text x="108" y="538" fill="white" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="14" font-weight="700">Data Visualisation</text>
  <text x="108" y="555" fill="#3A6A7A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="12">10 chapters · By Priya N.</text>
  <rect x="108" y="570" width="230" height="4" rx="2" fill="#0A1A2A"/>
  <rect x="108" y="570" width="184" height="4" rx="2" fill="#FF9F0A"/>
  <text x="108" y="590" fill="rgba(255,255,255,0.5)" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="11">80% complete</text>
  <text x="344" y="590" fill="#00C8FF" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="11" font-weight="600" text-anchor="end">Continue</text>
  <!-- Tab bar: Learn active -->
  <rect x="0" y="762" width="390" height="82" fill="#000408"/>
  <line x1="0" y1="762" x2="390" y2="762" stroke="#0A1A2A" stroke-width="0.5"/>
  <path d="M42 800 L51 790 L60 800 L60 810 L42 810 Z" fill="none" stroke="#2A4A5A" stroke-width="2" stroke-linejoin="round"/>
  <rect x="46" y="802" width="10" height="8" rx="1" fill="#2A4A5A"/>
  <text x="51" y="822" fill="#2A4A5A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="10" text-anchor="middle">Home</text>
  <rect x="119" y="785" width="14" height="18" rx="2" fill="none" stroke="#00C8FF" stroke-width="2"/>
  <path d="M119 792 L133 792" stroke="#00C8FF" stroke-width="1.5" stroke-linecap="round"/>
  <path d="M119 798 L133 798" stroke="#00C8FF" stroke-width="1.5" stroke-linecap="round"/>
  <text x="126" y="822" fill="#00C8FF" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="10" font-weight="600" text-anchor="middle">Learn</text>
  <circle cx="195" cy="793" r="10" fill="none" stroke="#2A4A5A" stroke-width="2"/>
  <path d="M190 793 L194 797 L201 788" fill="none" stroke="#2A4A5A" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
  <text x="195" y="822" fill="#2A4A5A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="10" text-anchor="middle">Practice</text>
  <rect x="254" y="800" width="5" height="8" rx="1.5" fill="#2A4A5A"/>
  <rect x="261" y="794" width="5" height="14" rx="1.5" fill="#2A4A5A"/>
  <rect x="268" y="789" width="5" height="19" rx="1.5" fill="#2A4A5A"/>
  <text x="263" y="822" fill="#2A4A5A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="10" text-anchor="middle">Progress</text>
  <circle cx="341" cy="791" r="8" fill="none" stroke="#2A4A5A" stroke-width="2"/><circle cx="341" cy="788" r="3" fill="#2A4A5A"/>
  <path d="M333 799 Q341 795 349 799" fill="none" stroke="#2A4A5A" stroke-width="2" stroke-linecap="round"/>
  <text x="341" y="822" fill="#2A4A5A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="10" text-anchor="middle">Profile</text>
  <rect x="148" y="836" width="94" height="4" rx="2" fill="rgba(255,255,255,0.22)"/>
</svg>
