{
  "id": "expert-lens-feature",
  "name": "Feature Landing",
  "theme": "expert-lens",
  "category": "Landing",
  "description": "A dark landing page that opens with a claim it can defend, and puts the evidence directly underneath rather than three sections down.",
  "layout": "Full-width dark hero with a duotone image bled behind a left-aligned claim, then three evidence blocks in a row where each one is a number and a source rather than a benefit.",
  "modules": [
    {
      "key": "hero",
      "name": "Claim hero",
      "html": "\n<section class=\"hero\"><img src=\"{{ART hero}}\" alt=\"{{ARTALT hero}}\">\n  <div class=\"hero-t\"><span class=\"k\">Peer review infrastructure</span><h1>Reviews that disagree are the ones worth reading.</h1><p>Lens keeps dissent visible instead of averaging it away, and publishes reviewer calibration so a low score means something.</p><div class=\"cta\"><a class=\"go\" href=\"#\">Request access</a><a class=\"lnk\" href=\"#\">See a public round</a></div></div>\n</section>"
    },
    {
      "key": "evidence",
      "name": "Evidence row",
      "html": "\n<div class=\"ev\">\n  <div class=\"e\"><span class=\"n\">11%</span><p>of reviews on Lens record a formal dissent, against 3% on the platforms it replaced.</p><cite>Internal, 2,140 rounds</cite></div>\n  <div class=\"e\"><span class=\"n\">6 days</span><p>median turnaround, unchanged after calibration publishing was introduced.</p><cite>Internal, 18 months</cite></div>\n  <div class=\"e\"><span class=\"n\">2.1×</span><p>more third-reviewer assignments, because splits are detected rather than resolved by rounding.</p><cite>Internal, 2,140 rounds</cite></div>\n</div>"
    },
    {
      "key": "how",
      "name": "How it works",
      "html": "\n<section class=\"how\">\n  <h2>Three things it does differently</h2>\n  <ol>\n    <li><b>Publishes reviewer bias</b><p>Every reviewer's mean offset from the panel is visible on their profile. Nobody is penalised for it; everybody reads scores in context.</p></li>\n    <li><b>Refuses to average a split</b><p>When two reviewers are more than two points apart, the round does not close. It assigns a third.</p></li>\n    <li><b>Keeps the dissent in the record</b><p>Minority opinions are published alongside the decision, attributed after the round closes.</p></li>\n  </ol>\n</section>"
    },
    {
      "key": "close",
      "name": "Closing band",
      "html": "\n<footer class=\"cb\"><h3>Used by 41 panels</h3><p>Including three national funding bodies and the review process for two journals that asked not to be named yet.</p><a class=\"go\" href=\"#\">Request access</a></footer>"
    }
  ],
  "moduleCount": 4,
  "reorderable": true,
  "meta": {
    "id": "expert-lens-feature",
    "model": "Claude Opus 5",
    "author": "Claude Code",
    "createdAt": "2026-08-29T18:34:32+09:00",
    "updatedAt": "2026-08-29T18:34:32+09:00",
    "version": "1.0.0",
    "isNew": false
  },
  "link": "/api/v1/designs/expert-lens-feature.json",
  "structure": "Full-width dark hero with a duotone image bled behind a left-aligned claim, then three evidence blocks in a row where each one is a number and a source rather than a benefit.",
  "html": "<div class=\"dz dz-expert-lens-feature\" data-design=\"expert-lens-feature\" data-theme=\"expert-lens\">\n<section class=\"dz-mod\" data-mod=\"hero\" aria-label=\"Claim hero\">\n<section class=\"hero\"><img src=\"https://designlookbook.dev/assets/img/expert-lens-hero.webp\" alt=\"A dark desk lit by one lamp with a jade glow behind\">\n  <div class=\"hero-t\"><span class=\"k\">Peer review infrastructure</span><h1>Reviews that disagree are the ones worth reading.</h1><p>Lens keeps dissent visible instead of averaging it away, and publishes reviewer calibration so a low score means something.</p><div class=\"cta\"><a class=\"go\" href=\"#\">Request access</a><a class=\"lnk\" href=\"#\">See a public round</a></div></div>\n</section></section>\n<section class=\"dz-mod\" data-mod=\"evidence\" aria-label=\"Evidence row\">\n<div class=\"ev\">\n  <div class=\"e\"><span class=\"n\">11%</span><p>of reviews on Lens record a formal dissent, against 3% on the platforms it replaced.</p><cite>Internal, 2,140 rounds</cite></div>\n  <div class=\"e\"><span class=\"n\">6 days</span><p>median turnaround, unchanged after calibration publishing was introduced.</p><cite>Internal, 18 months</cite></div>\n  <div class=\"e\"><span class=\"n\">2.1×</span><p>more third-reviewer assignments, because splits are detected rather than resolved by rounding.</p><cite>Internal, 2,140 rounds</cite></div>\n</div></section>\n<section class=\"dz-mod\" data-mod=\"how\" aria-label=\"How it works\">\n<section class=\"how\">\n  <h2>Three things it does differently</h2>\n  <ol>\n    <li><b>Publishes reviewer bias</b><p>Every reviewer's mean offset from the panel is visible on their profile. Nobody is penalised for it; everybody reads scores in context.</p></li>\n    <li><b>Refuses to average a split</b><p>When two reviewers are more than two points apart, the round does not close. It assigns a third.</p></li>\n    <li><b>Keeps the dissent in the record</b><p>Minority opinions are published alongside the decision, attributed after the round closes.</p></li>\n  </ol>\n</section></section>\n<section class=\"dz-mod\" data-mod=\"close\" aria-label=\"Closing band\">\n<footer class=\"cb\"><h3>Used by 41 panels</h3><p>Including three national funding bodies and the review process for two journals that asked not to be named yet.</p><a class=\"go\" href=\"#\">Request access</a></footer></section>\n</div>",
  "css": "\n.dz-expert-lens-feature { background: var(--background); color: var(--foreground); font-family: var(--pv-body); }\n.dz-expert-lens-feature .hero { position: relative; min-height: 300px; display: grid; align-items: center; overflow: hidden; }\n.dz-expert-lens-feature .hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: var(--img-filter); opacity: .5; }\n.dz-expert-lens-feature .hero-t { position: relative; padding: 40px 40px; max-width: 40rem; }\n.dz-expert-lens-feature .k { font-size: 10.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--primary); }\n.dz-expert-lens-feature .hero h1 { font-family: var(--pv-display); font-size: 44px; line-height: 1.1; font-weight: 500; margin: 10px 0 14px; }\n.dz-expert-lens-feature .hero p { margin: 0 0 22px; font-size: 16.5px; line-height: 1.6; color: var(--muted-foreground); max-width: 40ch; }\n.dz-expert-lens-feature .cta { display: flex; align-items: center; gap: 20px; }\n.dz-expert-lens-feature .go { display: inline-block; font-size: 14.5px; font-weight: 600; padding: 12px 24px; border-radius: var(--pv-radius-sm); background: var(--primary); color: var(--primary-foreground); text-decoration: none; transition: opacity var(--dur) var(--ease); }\n.dz-expert-lens-feature .go:hover { opacity: .88; }\n.dz-expert-lens-feature .lnk { font-size: 14px; color: var(--foreground); text-decoration: none; box-shadow: inset 0 -2px 0 var(--primary); padding-bottom: 2px; }\n.dz-expert-lens-feature .ev { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; padding: 26px 40px; }\n.dz-expert-lens-feature .e { background: var(--card); border-radius: var(--pv-radius); padding: 18px 20px; }\n.dz-expert-lens-feature .n { font-family: var(--pv-display); font-size: 40px; color: var(--primary); line-height: 1; }\n.dz-expert-lens-feature .e p { margin: 10px 0 8px; font-size: 14px; line-height: 1.62; }\n.dz-expert-lens-feature .e cite { font-style: normal; font-family: var(--pv-mono); font-size: 10.5px; letter-spacing: .06em; color: var(--muted-foreground); }\n.dz-expert-lens-feature .how { padding: 6px 40px 30px; }\n.dz-expert-lens-feature .how h2 { font-family: var(--pv-display); font-size: 24px; font-weight: 500; margin: 0 0 16px; }\n.dz-expert-lens-feature .how ol { list-style: none; margin: 0; padding: 0; counter-reset: h; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }\n.dz-expert-lens-feature .how li { counter-increment: h; padding-top: 14px; box-shadow: inset 0 2px 0 var(--primary); }\n.dz-expert-lens-feature .how li::before { content: counter(h, decimal-leading-zero); font-family: var(--pv-mono); font-size: 11px; color: var(--primary); }\n.dz-expert-lens-feature .how b { display: block; font-family: var(--pv-display); font-size: 18px; font-weight: 500; margin: 6px 0 6px; }\n.dz-expert-lens-feature .how p { margin: 0; font-size: 13.5px; line-height: 1.66; color: var(--muted-foreground); }\n.dz-expert-lens-feature .cb { background: var(--card); padding: 26px 40px; display: flex; align-items: center; gap: 26px; }\n.dz-expert-lens-feature .cb h3 { font-family: var(--pv-display); font-size: 24px; font-weight: 500; margin: 0; white-space: nowrap; }\n.dz-expert-lens-feature .cb p { margin: 0; font-size: 14px; line-height: 1.6; color: var(--muted-foreground); max-width: 50ch; }\n.dz-expert-lens-feature .cb .go { margin-left: auto; flex: none; }\n@media (prefers-reduced-motion: reduce) { .dz-expert-lens-feature *, .dz-expert-lens-feature *::before, .dz-expert-lens-feature *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; } }",
  "requiredTheme": "/api/v1/themes/expert-lens.json",
  "googleFontsHref": "https://fonts.googleapis.com/css2?family=Newsreader:wght@400;500;600;700&family=Source+Sans+3:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600;700&display=swap"
}