<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 470" fill="none" role="img" aria-label="5office 대시보드 화면 예시">
  <defs>
    <linearGradient id="dbPurple" x1="0" y1="0" x2="1" y2="1">
      <stop offset="0" stop-color="#6f66f2"/>
      <stop offset="1" stop-color="#4f46e5"/>
    </linearGradient>
    <filter id="dbSoft" x="-15%" y="-15%" width="130%" height="130%">
      <feDropShadow dx="0" dy="18" stdDeviation="22" flood-color="#3b34b8" flood-opacity="0.22"/>
    </filter>
    <clipPath id="dbWin"><rect x="14" y="14" width="612" height="442" rx="20"/></clipPath>
  </defs>

  <!-- 배경 장식 -->
  <circle cx="588" cy="60" r="10" fill="#ffd15c" opacity="0.9"/>
  <circle cx="40" cy="120" r="8" fill="#ff8aa0" opacity="0.75"/>

  <!-- 앱 윈도우 -->
  <g filter="url(#dbSoft)">
    <rect x="14" y="14" width="612" height="442" rx="20" fill="#ffffff"/>
  </g>
  <g clip-path="url(#dbWin)">
    <rect x="14" y="14" width="612" height="442" fill="#f6f7fb"/>
    <!-- 사이드바 -->
    <rect x="14" y="14" width="156" height="442" fill="#26244d"/>
    <text x="34" y="48" font-family="Arial, sans-serif" font-size="21" font-weight="800"><tspan fill="#8f8bf0">5</tspan><tspan fill="#ffffff">office</tspan></text>
    <!-- 홈/워크스페이스 -->
    <rect x="30" y="64" width="124" height="28" rx="8" fill="#34316b"/>
    <circle cx="46" cy="78" r="5" fill="#8f8bf0"/>
    <rect x="58" y="74" width="72" height="8" rx="4" fill="#cfd0f5"/>
    <rect x="30" y="100" width="124" height="30" rx="8" fill="#5b52e0"/>
    <rect x="44" y="111" width="78" height="9" rx="4.5" fill="#ffffff"/>
    <path d="M140 112 l5 5 l5 -5" stroke="#ffffff" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"/>
    <!-- 메뉴 바 -->
    <g fill="#4a4780">
      <rect x="34" y="150" width="86" height="8" rx="4"/>
      <rect x="34" y="176" width="72" height="8" rx="4"/>
      <rect x="34" y="202" width="80" height="8" rx="4"/>
      <rect x="34" y="228" width="64" height="8" rx="4"/>
      <rect x="34" y="254" width="76" height="8" rx="4"/>
      <rect x="34" y="280" width="88" height="8" rx="4"/>
      <rect x="34" y="306" width="60" height="8" rx="4"/>
    </g>
    <rect x="34" y="336" width="40" height="7" rx="3.5" fill="#6f6ca8"/>
    <g fill="#3f3c73">
      <rect x="34" y="358" width="78" height="8" rx="4"/>
      <rect x="34" y="382" width="66" height="8" rx="4"/>
    </g>
    <!-- 사용량 -->
    <rect x="30" y="424" width="124" height="8" rx="4" fill="#34316b"/>
    <rect x="30" y="424" width="10" height="8" rx="4" fill="#8f8bf0"/>

    <!-- 본문: 인사말 -->
    <rect x="190" y="34" width="176" height="15" rx="7.5" fill="#2b2950"/>
    <circle cx="378" cy="41" r="8" fill="#ffd15c"/>
    <rect x="190" y="58" width="120" height="9" rx="4.5" fill="#c7c9f7"/>

    <!-- 근태 스트립 -->
    <rect x="190" y="80" width="420" height="42" rx="12" fill="#ffffff" stroke="#e7e8f2"/>
    <rect x="204" y="95" width="14" height="14" rx="4" fill="#5b52e0"/>
    <rect x="228" y="98" width="150" height="9" rx="4.5" fill="#d7d9ea"/>
    <rect x="520" y="90" width="76" height="22" rx="11" fill="#5b52e0"/>
    <rect x="536" y="98" width="44" height="7" rx="3.5" fill="#ffffff"/>

    <!-- 통계 카드 4개 -->
    <!-- card1 재직자 10 -->
    <rect x="190" y="132" width="100" height="78" rx="12" fill="#ffffff" stroke="#e7e8f2"/>
    <rect x="204" y="146" width="52" height="8" rx="4" fill="#c7c9f7"/>
    <text x="204" y="188" font-family="Arial, sans-serif" font-size="26" font-weight="800" fill="#26244d">10</text>
    <rect x="256" y="146" width="22" height="22" rx="7" fill="#e3f6ea"/>
    <circle cx="267" cy="154" r="3" fill="#10b981"/><path d="M261 165 a6 6 0 0 1 12 0 z" fill="#10b981"/>
    <!-- card2 결재 0 -->
    <rect x="298" y="132" width="100" height="78" rx="12" fill="#ffffff" stroke="#e7e8f2"/>
    <rect x="312" y="146" width="52" height="8" rx="4" fill="#c7c9f7"/>
    <text x="312" y="188" font-family="Arial, sans-serif" font-size="26" font-weight="800" fill="#26244d">0</text>
    <rect x="364" y="146" width="22" height="22" rx="7" fill="#fff1de"/>
    <rect x="370" y="151" width="10" height="12" rx="2" fill="#f59e0b"/>
    <!-- card3 인건비 -->
    <rect x="406" y="132" width="100" height="78" rx="12" fill="#ffffff" stroke="#e7e8f2"/>
    <rect x="420" y="146" width="52" height="8" rx="4" fill="#c7c9f7"/>
    <text x="420" y="186" font-family="Arial, sans-serif" font-size="24" font-weight="800" fill="#b9bbd0">—</text>
    <rect x="472" y="146" width="22" height="22" rx="7" fill="#ece9fe"/>
    <circle cx="483" cy="157" r="7" fill="none" stroke="#7c3aed" stroke-width="2"/>
    <!-- card4 경비 -->
    <rect x="514" y="132" width="96" height="78" rx="12" fill="#ffffff" stroke="#e7e8f2"/>
    <rect x="528" y="146" width="52" height="8" rx="4" fill="#c7c9f7"/>
    <text x="528" y="186" font-family="Arial, sans-serif" font-size="24" font-weight="800" fill="#b9bbd0">—</text>
    <rect x="580" y="146" width="22" height="22" rx="7" fill="#e0f2fe"/>
    <rect x="585" y="152" width="12" height="9" rx="2" fill="#3b82f6"/>

    <!-- 빠른 메뉴 카드 -->
    <rect x="190" y="222" width="300" height="220" rx="14" fill="#ffffff" stroke="#e7e8f2"/>
    <rect x="206" y="240" width="70" height="10" rx="5" fill="#26244d"/>
    <!-- 타일 4x2 -->
    <g>
      <!-- row1 -->
      <g transform="translate(206 268)">
        <rect width="46" height="46" rx="12" fill="#e8eafe"/><circle cx="23" cy="20" r="5" fill="#5b52e0"/><path d="M15 32 a8 8 0 0 1 16 0 z" fill="#5b52e0"/>
        <rect x="4" y="54" width="38" height="7" rx="3.5" fill="#d7d9ea"/>
      </g>
      <g transform="translate(272 268)">
        <rect width="46" height="46" rx="12" fill="#e3f6ea"/><rect x="14" y="15" width="18" height="16" rx="3" fill="#10b981"/>
        <rect x="4" y="54" width="38" height="7" rx="3.5" fill="#d7d9ea"/>
      </g>
      <g transform="translate(338 268)">
        <rect width="46" height="46" rx="12" fill="#fff1de"/><rect x="15" y="13" width="16" height="20" rx="3" fill="#f59e0b"/>
        <rect x="4" y="54" width="38" height="7" rx="3.5" fill="#d7d9ea"/>
      </g>
      <g transform="translate(404 268)">
        <rect width="46" height="46" rx="12" fill="#ece9fe"/><rect x="14" y="16" width="18" height="14" rx="3" fill="#7c3aed"/>
        <rect x="4" y="54" width="38" height="7" rx="3.5" fill="#d7d9ea"/>
      </g>
      <!-- row2 -->
      <g transform="translate(206 350)">
        <rect width="46" height="46" rx="12" fill="#e0f2fe"/><rect x="13" y="14" width="20" height="18" rx="3" fill="#3b82f6"/>
        <rect x="4" y="54" width="38" height="7" rx="3.5" fill="#d7d9ea"/>
      </g>
      <g transform="translate(272 350)">
        <rect width="46" height="46" rx="12" fill="#fde7ef"/><path d="M14 30 l0 -14 l8 0 l2 4 l8 0 l0 10 z" fill="#ec4899"/>
        <rect x="4" y="54" width="38" height="7" rx="3.5" fill="#d7d9ea"/>
      </g>
      <g transform="translate(338 350)">
        <rect width="46" height="46" rx="12" fill="#e8eafe"/><rect x="14" y="14" width="6" height="18" rx="2" fill="#5b52e0"/><rect x="22" y="18" width="6" height="14" rx="2" fill="#5b52e0"/><rect x="30" y="14" width="6" height="18" rx="2" fill="#5b52e0"/>
        <rect x="4" y="54" width="38" height="7" rx="3.5" fill="#d7d9ea"/>
      </g>
    </g>

    <!-- 우측 패널: 이번 달 일정 -->
    <rect x="500" y="222" width="110" height="104" rx="12" fill="#ffffff" stroke="#e7e8f2"/>
    <rect x="512" y="236" width="20" height="9" rx="4.5" fill="#26244d"/>
    <rect x="522" y="266" width="24" height="22" rx="4" fill="#eef0ff"/>
    <rect x="527" y="262" width="4" height="6" rx="2" fill="#c7c9f7"/><rect x="537" y="262" width="4" height="6" rx="2" fill="#c7c9f7"/>
    <rect x="512" y="300" width="86" height="7" rx="3.5" fill="#eceef6"/>
    <!-- 우측 패널: 사내 공지 -->
    <rect x="500" y="338" width="110" height="104" rx="12" fill="#ffffff" stroke="#e7e8f2"/>
    <rect x="512" y="352" width="30" height="9" rx="4.5" fill="#26244d"/>
    <path d="M516 388 l14 -8 l0 20 l-14 -8 z" fill="#ffd15c"/><rect x="530" y="382" width="18" height="12" rx="2" fill="#ffe6a3"/>
    <rect x="512" y="416" width="86" height="7" rx="3.5" fill="#eceef6"/>
  </g>

  <!-- AI 도우미 버튼 (플로팅) -->
  <g filter="url(#dbSoft)">
    <circle cx="598" cy="428" r="24" fill="url(#dbPurple)"/>
  </g>
  <path d="M598 414 l4 8 l8 4 l-8 4 l-4 8 l-4 -8 l-8 -4 l8 -4 z" fill="#ffffff"/>
</svg>
