{
  "id": "terminal-ledger-device-auth",
  "name": "Device Authorisation",
  "theme": "terminal-ledger",
  "category": "Auth & Onboarding",
  "description": "The browser half of a CLI device flow, showing the code in a size you can read across a desk and naming exactly what is being granted.",
  "layout": "A narrow centred stack: the code set at 44px with letter-spacing wide enough to read aloud, then a grant table, then two equal-weight buttons — approve is not larger than deny.",
  "modules": [
    {
      "key": "code",
      "name": "Device code",
      "html": "\n<div class=\"dc\"><span class=\"dc-k\">ENTER THIS CODE IN YOUR TERMINAL</span><code>HXQP-4M2V</code><span class=\"dc-x\">expires in 08:41</span></div>"
    },
    {
      "key": "grant",
      "name": "Grant detail",
      "html": "\n<div class=\"gr\">\n  <h1>AUTHORISE LEDGER CLI</h1>\n  <table>\n    <tbody>\n      <tr><th scope=\"row\">CLIENT</th><td>ledger-cli 3.8.0</td></tr>\n      <tr><th scope=\"row\">DEVICE</th><td>mokafor-mbp · macOS 15.5</td></tr>\n      <tr><th scope=\"row\">ADDRESS</th><td>82.14.9.204 · Leeds, GB</td></tr>\n      <tr><th scope=\"row\">SCOPE</th><td class=\"sc\">topics:read topics:write groups:read groups:write metrics:read</td></tr>\n      <tr><th scope=\"row\">EXPIRES</th><td>8 hours after approval</td></tr>\n    </tbody>\n  </table>\n</div>"
    },
    {
      "key": "decide",
      "name": "Approve or deny",
      "html": "\n<div class=\"dec\"><button type=\"button\" class=\"no\">DENY</button><button type=\"button\" class=\"yes\">APPROVE</button></div>"
    },
    {
      "key": "warn",
      "name": "Safety notice",
      "html": "\n<footer class=\"wn\"><b>IF YOU DID NOT START THIS</b><p>Press DENY. Nobody from this organisation will ever ask you to read a device code to them over a call or a chat.</p></footer>"
    }
  ],
  "moduleCount": 4,
  "reorderable": false,
  "meta": {
    "id": "terminal-ledger-device-auth",
    "model": "Claude Opus 5",
    "author": "Claude Code",
    "createdAt": "2026-08-29T18:41:55+09:00",
    "updatedAt": "2026-08-29T18:41:55+09:00",
    "version": "1.0.0",
    "isNew": false
  },
  "link": "/api/v1/designs/terminal-ledger-device-auth.json",
  "structure": "A narrow centred stack: the code set at 44px with letter-spacing wide enough to read aloud, then a grant table, then two equal-weight buttons — approve is not larger than deny.",
  "html": "<div class=\"dz dz-terminal-ledger-device-auth\" data-design=\"terminal-ledger-device-auth\" data-theme=\"terminal-ledger\">\n<div class=\"box\"><section class=\"dz-mod\" data-mod=\"code\" aria-label=\"Device code\">\n<div class=\"dc\"><span class=\"dc-k\">ENTER THIS CODE IN YOUR TERMINAL</span><code>HXQP-4M2V</code><span class=\"dc-x\">expires in 08:41</span></div></section><section class=\"dz-mod\" data-mod=\"grant\" aria-label=\"Grant detail\">\n<div class=\"gr\">\n  <h1>AUTHORISE LEDGER CLI</h1>\n  <table>\n    <tbody>\n      <tr><th scope=\"row\">CLIENT</th><td>ledger-cli 3.8.0</td></tr>\n      <tr><th scope=\"row\">DEVICE</th><td>mokafor-mbp · macOS 15.5</td></tr>\n      <tr><th scope=\"row\">ADDRESS</th><td>82.14.9.204 · Leeds, GB</td></tr>\n      <tr><th scope=\"row\">SCOPE</th><td class=\"sc\">topics:read topics:write groups:read groups:write metrics:read</td></tr>\n      <tr><th scope=\"row\">EXPIRES</th><td>8 hours after approval</td></tr>\n    </tbody>\n  </table>\n</div></section><section class=\"dz-mod\" data-mod=\"decide\" aria-label=\"Approve or deny\">\n<div class=\"dec\"><button type=\"button\" class=\"no\">DENY</button><button type=\"button\" class=\"yes\">APPROVE</button></div></section></div><section class=\"dz-mod\" data-mod=\"warn\" aria-label=\"Safety notice\">\n<footer class=\"wn\"><b>IF YOU DID NOT START THIS</b><p>Press DENY. Nobody from this organisation will ever ask you to read a device code to them over a call or a chat.</p></footer></section>\n</div>",
  "css": "\n.dz-terminal-ledger-device-auth { background: var(--background); color: var(--foreground); font-family: var(--pv-mono); font-size: 12.5px; padding: 40px 20px; }\n.dz-terminal-ledger-device-auth .box { max-width: 30rem; margin: 0 auto; border: var(--pv-bw) solid var(--border); }\n.dz-terminal-ledger-device-auth .dc { padding: 22px 24px; text-align: center; border-bottom: var(--pv-bw) solid var(--border); }\n.dz-terminal-ledger-device-auth .dc-k { display: block; font-size: 10.5px; letter-spacing: .16em; color: var(--muted-foreground); }\n.dz-terminal-ledger-device-auth .dc code { display: block; font-family: inherit; font-size: 44px; letter-spacing: .16em; margin: 12px 0 8px; color: var(--chart-1); }\n.dz-terminal-ledger-device-auth .dc-x { font-size: 11px; color: var(--chart-4); }\n.dz-terminal-ledger-device-auth .gr { padding: 20px 24px; }\n.dz-terminal-ledger-device-auth .gr h1 { font-size: 13px; letter-spacing: .14em; margin: 0 0 14px; }\n.dz-terminal-ledger-device-auth .gr table { width: 100%; border-collapse: collapse; }\n.dz-terminal-ledger-device-auth .gr th { text-align: left; width: 88px; font-size: 10.5px; letter-spacing: .1em; color: var(--muted-foreground); font-weight: 400; padding: 7px 12px 7px 0; vertical-align: top; }\n.dz-terminal-ledger-device-auth .gr td { padding: 7px 0; border-bottom: var(--pv-bw) solid var(--border); font-size: 12px; }\n.dz-terminal-ledger-device-auth .gr .sc { color: var(--primary); line-height: 1.5; }\n.dz-terminal-ledger-device-auth .dec { display: grid; grid-template-columns: 1fr 1fr; border-top: var(--pv-bw) solid var(--border); }\n.dz-terminal-ledger-device-auth .dec button { font: inherit; font-size: 12px; letter-spacing: .14em; padding: 15px; border: 0; cursor: pointer; transition: background var(--dur) var(--ease), color var(--dur) var(--ease); }\n.dz-terminal-ledger-device-auth .no { background: var(--background); color: var(--destructive); border-right: var(--pv-bw) solid var(--border); }\n.dz-terminal-ledger-device-auth .no:hover { background: var(--destructive); color: var(--background); }\n.dz-terminal-ledger-device-auth .yes { background: var(--background); color: var(--chart-1); }\n.dz-terminal-ledger-device-auth .yes:hover { background: var(--chart-1); color: var(--background); }\n.dz-terminal-ledger-device-auth .wn { max-width: 30rem; margin: 16px auto 0; border-left: 2px solid var(--chart-4); padding: 10px 14px; }\n.dz-terminal-ledger-device-auth .wn b { font-size: 10.5px; letter-spacing: .12em; color: var(--chart-4); }\n.dz-terminal-ledger-device-auth .wn p { margin: 5px 0 0; font-size: 11.5px; line-height: 1.6; color: var(--muted-foreground); }\n@media (prefers-reduced-motion: reduce) { .dz-terminal-ledger-device-auth *, .dz-terminal-ledger-device-auth *::before, .dz-terminal-ledger-device-auth *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; } }",
  "requiredTheme": "/api/v1/themes/terminal-ledger.json",
  "googleFontsHref": "https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&display=swap"
}