Draw the Warm Welcome Secret Hat Winter Bash 2014 is on its prime and don't we all love the hats? Especially the secret hats!
So why not draw one of secret hats?
The challenge
Your task is to draw the Warm Welcome Hat in proportion, in a language of your choice and having an exact construction as appearing on this page.
As always, you can render the hat to a file or screen using vector or raster graphics. If your output is rasterised, your image must have dimensions of 400x400 pixels or more.
Moreover, the actual contents of the hat (the area of the bounding rectangle of the colored parts of the image) should cover more than 40% of your output image.
Specifications
The image below lists out various dimensions of the hat. All dimensions are in the unit, for example, pixels. All border radius in the image are to be drawn with a radius of 13 units.

Colors:

Red in the star and circular ring - rgb(255, 28, 34)
Yellow in the circle - rgb(255, 202, 87)
Lightest grey - rgb(88, 88, 92)
Darkest grey - rgb(31, 26, 26)
Middle grey - rgb(64, 64, 64)

Scoring
This is code golf, so the shortest answer (in bytes) wins.
As a word of warning, using existing compression (like embedding a compressed GIF) falls into several standard loopholes.
SVG (462 460 454 429 384 365 bytes)

I know it isn't a programming language, but I thought this will at least be useful to anyone generating SVG output...

This is based on Peter Taylor's SVG.

By using the original coords, and optimizing the paths a little, I managed to shrink the SVG down.  I also fixed the colours.



&lt;svg&gt;&lt;g stroke-linecap=round stroke-linejoin=round stroke-width=26&gt;&lt;path d=M54,13,13,36V75H151V36L110,13 stroke=#1f1a1a /&gt;&lt;path d=M21,84V36H37A91,91,0,0,1,127,36h16V84z stroke=#404040 /&gt;&lt;path d=M30,36v48h104V36z stroke=#58585c fill=#58585c /&gt;&lt;/g&gt;&lt;circle cx=82 cy=60 r=23 fill=#ffca57 stroke=#ff1c22 stroke-width=5 /&gt;&lt;path d=M82,43,92,74,66,55H98L72,74z fill=#ff1c22




Update: Fixed flaw pointed out by Peter Taylor and position of rects and saved 2 more bytes.

Update 2: Incorporated another fix and suggestions from Peter (-6 bytes)

Update 3: Just noticed the instructions now specify all radii are 13, so taking advantage of that, and optimizing the paths a bit more, I saved another 25 bytes. More readable fiddle here.

Update 4: Since I am already assuming the SVG is embedded in HTML (standalone SVGs need the namespace declaration), I can actually squeeze this more. (a) I don't need the  width and height attributes because the size of the SVG is smaller than the default size browsers give to objects whose size is indeteminate (300x150), and (b) the HTML parser is forgiving about attributes which don't have quotes, so some of them can be removed (idea from Squeamish Ossifrage).  Saves another 45 bytes.

Update 5: Using hsl's tricks for de-quoting the colours and dropping the trailing end tags.  We saved another 19 bytes.  The latter seemed a bit cheaty to me at first, but since it works in all browsers, I changed my mind. :)  Thanks hsl!