{
  "id": "fitting-room-member",
  "name": "Member",
  "theme": "fitting-room",
  "category": "Profile & Social",
  "description": "A member’s page where the history is a run of past rail positions rather than a list of orders, and their sizes are stated once at the top.",
  "layout": "An identity block with fixed sizes, then a rail-shaped history strip per month, then a ruled list of what is currently out with dates first.",
  "modules": [
    {
      "key": "who",
      "name": "Member identity",
      "html": "\n<header class=\"wh\"><div><span class=\"k\">Member since November 2024</span><h1>Marta Reyes</h1><div class=\"sizes\"><span class=\"sz\">UK 12</span><span class=\"sz\">Tall</span><span class=\"sz\">Shoe 39</span><span class=\"sz\">Prefers wool</span></div></div><div class=\"stats\"><div><span class=\"k\">Out now</span><b>4</b></div><div><span class=\"k\">Returned on time</span><b>92%</b></div><div><span class=\"k\">Nights this year</span><b>184</b></div></div></header>"
    },
    {
      "key": "history",
      "name": "Rail history",
      "html": "\n<section class=\"hs\"><span class=\"k\">Where things have sat on the rail</span>\n<div class=\"mo\"><span class=\"ml mn\">Mar</span><div class=\"bar\"><span class=\"bk late\" style=\"left:0;width:12%\"></span><span class=\"bk\" style=\"left:20%;width:18%\"></span><span class=\"bk\" style=\"left:42%;width:24%\"></span><span class=\"bk\" style=\"left:70%;width:18%\"></span></div></div>\n<div class=\"mo\"><span class=\"ml mn\">Feb</span><div class=\"bar\"><span class=\"bk\" style=\"left:4%;width:22%\"></span><span class=\"bk\" style=\"left:32%;width:26%\"></span><span class=\"bk\" style=\"left:64%;width:20%\"></span></div></div>\n<div class=\"mo\"><span class=\"ml mn\">Jan</span><div class=\"bar\"><span class=\"bk\" style=\"left:0;width:28%\"></span><span class=\"bk late\" style=\"left:34%;width:16%\"></span><span class=\"bk\" style=\"left:56%;width:30%\"></span></div></div>\n<div class=\"mo\"><span class=\"ml mn\">Dec</span><div class=\"bar\"><span class=\"bk\" style=\"left:8%;width:34%\"></span><span class=\"bk\" style=\"left:48%;width:22%\"></span></div></div>\n</section>"
    },
    {
      "key": "out",
      "name": "Currently out",
      "html": "\n<footer class=\"ou\"><span class=\"k\">Currently out</span>\n<div class=\"rw\"><span class=\"du late\">Due 09 Mar</span><span class=\"nm\">Wool overcoat, navy</span><span class=\"cn\">Good</span><button class=\"gh\">Extend</button></div>\n<div class=\"rw\"><span class=\"du\">Due 13 Mar</span><span class=\"nm\">Silk shirt, oyster</span><span class=\"cn\">New</span><button class=\"gh\">Extend</button></div>\n<div class=\"rw\"><span class=\"du\">Due 15 Mar</span><span class=\"nm\">Pleated trousers, ink</span><span class=\"cn\">Worn</span><button class=\"gh\">Extend</button></div>\n<div class=\"rw\"><span class=\"du\">Due 17 Mar</span><span class=\"nm\">Knit dress, slate</span><span class=\"cn\">Repaired</span><button class=\"gh\">Extend</button></div>\n</footer>"
    }
  ],
  "moduleCount": 3,
  "reorderable": true,
  "meta": {
    "id": "fitting-room-member",
    "model": "Claude Opus 5",
    "author": "Claude Code",
    "createdAt": "2026-09-02T01:37:40+09:00",
    "updatedAt": "2026-09-02T01:37:40+09:00",
    "version": "1.0.0",
    "isNew": false
  },
  "link": "/api/v1/designs/fitting-room-member.json",
  "structure": "An identity block with fixed sizes, then a rail-shaped history strip per month, then a ruled list of what is currently out with dates first.",
  "html": "<div class=\"dz dz-fitting-room-member\" data-design=\"fitting-room-member\" data-theme=\"fitting-room\">\n<section class=\"dz-mod\" data-mod=\"who\" aria-label=\"Member identity\">\n<header class=\"wh\"><div><span class=\"k\">Member since November 2024</span><h1>Marta Reyes</h1><div class=\"sizes\"><span class=\"sz\">UK 12</span><span class=\"sz\">Tall</span><span class=\"sz\">Shoe 39</span><span class=\"sz\">Prefers wool</span></div></div><div class=\"stats\"><div><span class=\"k\">Out now</span><b>4</b></div><div><span class=\"k\">Returned on time</span><b>92%</b></div><div><span class=\"k\">Nights this year</span><b>184</b></div></div></header></section>\n<section class=\"dz-mod\" data-mod=\"history\" aria-label=\"Rail history\">\n<section class=\"hs\"><span class=\"k\">Where things have sat on the rail</span>\n<div class=\"mo\"><span class=\"ml mn\">Mar</span><div class=\"bar\"><span class=\"bk late\" style=\"left:0;width:12%\"></span><span class=\"bk\" style=\"left:20%;width:18%\"></span><span class=\"bk\" style=\"left:42%;width:24%\"></span><span class=\"bk\" style=\"left:70%;width:18%\"></span></div></div>\n<div class=\"mo\"><span class=\"ml mn\">Feb</span><div class=\"bar\"><span class=\"bk\" style=\"left:4%;width:22%\"></span><span class=\"bk\" style=\"left:32%;width:26%\"></span><span class=\"bk\" style=\"left:64%;width:20%\"></span></div></div>\n<div class=\"mo\"><span class=\"ml mn\">Jan</span><div class=\"bar\"><span class=\"bk\" style=\"left:0;width:28%\"></span><span class=\"bk late\" style=\"left:34%;width:16%\"></span><span class=\"bk\" style=\"left:56%;width:30%\"></span></div></div>\n<div class=\"mo\"><span class=\"ml mn\">Dec</span><div class=\"bar\"><span class=\"bk\" style=\"left:8%;width:34%\"></span><span class=\"bk\" style=\"left:48%;width:22%\"></span></div></div>\n</section></section>\n<section class=\"dz-mod\" data-mod=\"out\" aria-label=\"Currently out\">\n<footer class=\"ou\"><span class=\"k\">Currently out</span>\n<div class=\"rw\"><span class=\"du late\">Due 09 Mar</span><span class=\"nm\">Wool overcoat, navy</span><span class=\"cn\">Good</span><button class=\"gh\">Extend</button></div>\n<div class=\"rw\"><span class=\"du\">Due 13 Mar</span><span class=\"nm\">Silk shirt, oyster</span><span class=\"cn\">New</span><button class=\"gh\">Extend</button></div>\n<div class=\"rw\"><span class=\"du\">Due 15 Mar</span><span class=\"nm\">Pleated trousers, ink</span><span class=\"cn\">Worn</span><button class=\"gh\">Extend</button></div>\n<div class=\"rw\"><span class=\"du\">Due 17 Mar</span><span class=\"nm\">Knit dress, slate</span><span class=\"cn\">Repaired</span><button class=\"gh\">Extend</button></div>\n</footer></section>\n</div>",
  "css": "\n.dz-fitting-room-member { background: var(--background); color: var(--foreground); font-family: var(--pv-body); padding: 28px; max-width: 900px; }\n.dz-fitting-room-member .k { text-transform: uppercase; letter-spacing: .15em; font-size: 10.5px; font-weight: 600; color: var(--muted-foreground); display: block; margin-bottom: 10px; }\n.dz-fitting-room-member .mn { font-family: var(--pv-mono); font-size: 13px; }\n.dz-fitting-room-member .wh { display: flex; gap: 40px; align-items: flex-start; padding-bottom: 22px; border-bottom: 1px solid var(--border); margin-bottom: 24px; }\n.dz-fitting-room-member h1 { font-family: var(--pv-display); font-weight: 500; font-size: 56px; line-height: 1.08; letter-spacing: -.02em; margin: 0 0 14px; }\n.dz-fitting-room-member .sizes { display: flex; gap: 8px; }\n.dz-fitting-room-member .sz, .dz-fitting-room-member .cn { text-transform: uppercase; letter-spacing: .15em; font-size: 10.5px; font-weight: 600; background: var(--secondary); color: var(--muted-foreground); border-radius: 4px; padding: 6px 10px; }\n.dz-fitting-room-member .stats { display: flex; gap: 28px; margin-left: auto; }\n.dz-fitting-room-member .stats b { font-family: var(--pv-display); font-weight: 500; font-size: 32px; display: block; }\n.dz-fitting-room-member .mo { display: grid; grid-template-columns: 50px 1fr; gap: 16px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--border); }\n.dz-fitting-room-member .ml { color: var(--muted-foreground); }\n.dz-fitting-room-member .bar { position: relative; height: 22px; background: var(--secondary); border-radius: 4px; }\n.dz-fitting-room-member .bk { position: absolute; top: 0; height: 22px; background: var(--primary); border-radius: 4px; display: block; }\n.dz-fitting-room-member .bk.late { background: var(--destructive); }\n.dz-fitting-room-member .ou { margin-top: 26px; }\n.dz-fitting-room-member .rw { display: grid; grid-template-columns: 170px 1fr 110px 100px; gap: 20px; align-items: center; padding: 13px 0; border-bottom: 1px solid var(--border); }\n\n.dz-fitting-room-member .du { font-family: var(--pv-mono); font-size: 13px; border-bottom: 2px solid var(--accent); padding-bottom: 3px; display: inline-block; }\n.dz-fitting-room-member .du.late { border-bottom-color: var(--destructive); color: var(--destructive); }\n.dz-fitting-room-member .nm { font-family: var(--pv-display); font-weight: 500; font-size: 19px; }\n.dz-fitting-room-member .gh { background: transparent; color: var(--foreground); border: 1px solid var(--border); border-radius: 4px; padding: 9px; font: inherit; font-size: 13px; cursor: pointer; }\n@media (prefers-reduced-motion: reduce) { .dz-fitting-room-member *, .dz-fitting-room-member *::before, .dz-fitting-room-member *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; } }\n",
  "requiredTheme": "/api/v1/themes/fitting-room.json",
  "googleFontsHref": "https://fonts.googleapis.com/css2?family=Frank+Ruhl+Libre:wght@400;500;600;700&family=Be+Vietnam+Pro:wght@400;500;600;700&family=M+PLUS+1+Code:wght@400;500;600;700&display=swap"
}