<svg xmlns="http://www.w3.org/2000/svg" width="390" height="844" viewBox="0 0 390 844">
  <filter id="fs"><feDropShadow dx="0" dy="2" stdDeviation="8" flood-color="#000" flood-opacity="0.07"/></filter>
  <rect width="390" height="844" fill="#FFF8F2"/>
  <!-- Status bar -->
  <text x="22" y="29" fill="#1A1A1A" 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="#1A1A1A"/><rect x="313" y="20" width="3" height="9" rx="1.2" fill="#1A1A1A"/><rect x="318" y="18" width="3" height="11" rx="1.2" fill="#1A1A1A"/><rect x="323" y="16" width="3" height="13" rx="1.2" fill="#1A1A1A"/>
  <rect x="350" y="19" width="22" height="11" rx="3" fill="none" stroke="rgba(0,0,0,0.3)" stroke-width="1.2"/><rect x="373" y="22" width="2" height="5" rx="1" fill="rgba(0,0,0,0.3)"/><rect x="352" y="21" width="16" height="7" rx="1.5" fill="#FF6B00"/>
  <!-- Back nav -->
  <text x="22" y="68" fill="#FF6B00" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="22" dominant-baseline="middle">&#x2039;</text>
  <text x="195" y="68" fill="#1A1A1A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="16" font-weight="700" text-anchor="middle" dominant-baseline="middle">Task Detail</text>
  <!-- Completion circle -->
  <circle cx="40" cy="112" r="18" fill="none" stroke="#FF6B00" stroke-width="2.5"/>
  <!-- Task title -->
  <text x="72" y="104" fill="#1A1A1A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="20" font-weight="800">Design new</text>
  <text x="72" y="128" fill="#1A1A1A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="20" font-weight="800">onboarding flow</text>
  <!-- Meta chips -->
  <rect x="16" y="150" width="358" height="58" rx="16" fill="#FFFFFF" filter="url(#fs)"/>
  <rect x="30" y="165" width="80" height="26" rx="13" fill="#FF6B00" fill-opacity="0.12"/>
  <text x="70" y="182" fill="#FF6B00" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="12" font-weight="700" text-anchor="middle" dominant-baseline="middle">High Priority</text>
  <rect x="120" y="165" width="92" height="26" rx="13" fill="#5B8DEF" fill-opacity="0.12"/>
  <text x="166" y="182" fill="#5B8DEF" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="12" font-weight="600" text-anchor="middle" dominant-baseline="middle">App Redesign</text>
  <rect x="222" y="165" width="90" height="26" rx="13" fill="#F0F0F0"/>
  <text x="267" y="182" fill="#888888" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="12" text-anchor="middle" dominant-baseline="middle">Due Today</text>
  <!-- Due date & assignee -->
  <rect x="16" y="220" width="170" height="56" rx="16" fill="#FFFFFF" filter="url(#fs)"/>
  <text x="30" y="240" fill="#AAAAAA" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="11" font-weight="700">DUE DATE</text>
  <text x="30" y="262" fill="#1A1A1A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="14" font-weight="600">Mar 6, 5:00 PM</text>
  <rect x="204" y="220" width="170" height="56" rx="16" fill="#FFFFFF" filter="url(#fs)"/>
  <text x="218" y="240" fill="#AAAAAA" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="11" font-weight="700">ASSIGNED TO</text>
  <circle cx="234" cy="260" r="10" fill="#FF6B00"/>
  <text x="234" y="264" fill="white" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="10" font-weight="800" text-anchor="middle" dominant-baseline="middle">AC</text>
  <text x="250" y="264" fill="#1A1A1A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="13" font-weight="600" dominant-baseline="middle">Alex C.</text>
  <!-- Description -->
  <rect x="16" y="288" width="358" height="80" rx="16" fill="#FFFFFF" filter="url(#fs)"/>
  <text x="30" y="308" fill="#AAAAAA" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="11" font-weight="700">DESCRIPTION</text>
  <text x="30" y="328" fill="#555555" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="13">Create wireframes for the new 4-step onboarding</text>
  <text x="30" y="348" fill="#555555" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="13">flow. Focus on reducing drop-off by step 2.</text>
  <!-- Subtasks -->
  <text x="22" y="394" fill="#888888" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="12" font-weight="700">SUBTASKS (3 of 5)</text>
  <rect x="16" y="404" width="358" height="52" rx="14" fill="#FFFFFF" filter="url(#fs)"/>
  <circle cx="42" cy="430" r="11" fill="#00C853"/>
  <path d="M37 430 L41 434 L48 425" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
  <text x="64" y="434" fill="#AAAAAA" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="13" text-decoration="line-through" dominant-baseline="middle">Research competitor onboarding</text>
  <rect x="16" y="464" width="358" height="52" rx="14" fill="#FFFFFF" filter="url(#fs)"/>
  <circle cx="42" cy="490" r="11" fill="#00C853"/>
  <path d="M37 490 L41 494 L48 485" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
  <text x="64" y="494" fill="#AAAAAA" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="13" text-decoration="line-through" dominant-baseline="middle">Sketch low-fi wireframes</text>
  <rect x="16" y="524" width="358" height="52" rx="14" fill="#FFFFFF" filter="url(#fs)"/>
  <circle cx="42" cy="550" r="11" fill="#00C853"/>
  <path d="M37 550 L41 554 L48 545" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
  <text x="64" y="554" fill="#AAAAAA" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="13" text-decoration="line-through" dominant-baseline="middle">Get PM sign-off on flow</text>
  <rect x="16" y="584" width="358" height="52" rx="14" fill="#FFFFFF" filter="url(#fs)"/>
  <circle cx="42" cy="610" r="11" fill="none" stroke="#FF6B00" stroke-width="2"/>
  <text x="64" y="614" fill="#1A1A1A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="13" font-weight="500" dominant-baseline="middle">Build hi-fi mockups in Figma</text>
  <rect x="16" y="644" width="358" height="52" rx="14" fill="#FFFFFF" filter="url(#fs)"/>
  <circle cx="42" cy="670" r="11" fill="none" stroke="#DDDDDD" stroke-width="2"/>
  <text x="64" y="674" fill="#1A1A1A" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="13" font-weight="500" dominant-baseline="middle">Share prototype for review</text>
  <!-- Mark done button -->
  <rect x="16" y="712" width="358" height="52" rx="26" fill="#FF6B00" filter="url(#fs)"/>
  <text x="195" y="742" fill="white" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="16" font-weight="800" text-anchor="middle" dominant-baseline="middle">Mark as Complete</text>
  <!-- Tab bar -->
  <rect x="0" y="762" width="390" height="82" fill="#FFFFFF"/>
  <line x1="0" y1="762" x2="390" y2="762" stroke="#EEEEEE" stroke-width="0.5"/>
  <rect x="30" y="792" width="24" height="20" rx="3" fill="none" stroke="#BBBBBB" stroke-width="2"/>
  <line x1="30" y1="800" x2="54" y2="800" stroke="#BBBBBB" stroke-width="1.5"/>
  <text x="43" y="824" fill="#BBBBBB" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="10" text-anchor="middle">Today</text>
  <rect x="108" y="792" width="22" height="20" rx="3" fill="none" stroke="#FF6B00" stroke-width="2"/>
  <rect x="112" y="788" width="14" height="6" rx="1.5" fill="none" stroke="#FF6B00" stroke-width="2"/>
  <text x="119" y="824" fill="#FF6B00" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="10" font-weight="600" text-anchor="middle">Projects</text>
  <rect x="181" y="792" width="22" height="20" rx="3" fill="none" stroke="#BBBBBB" stroke-width="2"/>
  <line x1="181" y1="799" x2="203" y2="799" stroke="#BBBBBB" stroke-width="1.5"/>
  <text x="193" y="824" fill="#BBBBBB" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="10" text-anchor="middle">Calendar</text>
  <circle cx="266" cy="802" r="10" fill="none" stroke="#BBBBBB" stroke-width="2"/>
  <line x1="266" y1="796" x2="266" y2="803" stroke="#BBBBBB" stroke-width="1.5" stroke-linecap="round"/>
  <line x1="266" y1="803" x2="270" y2="803" stroke="#BBBBBB" stroke-width="1.5" stroke-linecap="round"/>
  <text x="266" y="824" fill="#BBBBBB" font-family="-apple-system,BlinkMacSystemFont,sans-serif" font-size="10" text-anchor="middle">Focus</text>
  <circle cx="341" cy="794" r="9" fill="none" stroke="#BBBBBB" stroke-width="2"/><circle cx="341" cy="791" r="3.5" fill="#BBBBBB"/>
  <path d="M333 802 Q341 798 349 802" fill="none" stroke="#BBBBBB" stroke-width="2" stroke-linecap="round"/>
  <text x="341" y="824" fill="#BBBBBB" 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(0,0,0,0.15)"/>
</svg>
