:root{--ink:#06224a;--muted:#4c668a;--line:#c8d8f1;--soft:#f6f9ff;--blue:#006dff;--blue-dark:#003b8f;--green:#0b7a4b;--white:#fff;--max:980px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--white);font:15px/1.75 Inter,"Hiragino Sans","Noto Sans JP",sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--blue)}
code{padding:2px 6px;border-radius:5px;color:var(--blue-dark);background:#eaf1ff;font-family:"JetBrains Mono",monospace;font-size:13px}
.topbar{position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line);background:rgba(255,255,255,.96);backdrop-filter:blur(14px)}
.topbar-inner{max-width:var(--max);margin:0 auto;padding:14px 22px;display:flex;align-items:center;gap:20px}
.brand{margin-right:auto;color:var(--ink);text-decoration:none;font-weight:850;letter-spacing:-.02em}
.nav{display:flex;align-items:center;gap:16px}
.nav a{color:var(--muted);text-decoration:none;font-size:13px;font-weight:700}
.nav .dashboard{padding:8px 14px;border-radius:999px;color:#fff;background:var(--blue)}
.page{max-width:var(--max);margin:0 auto;padding:54px 22px 84px}
.eyebrow{color:var(--blue);font:700 11px/1.4 "JetBrains Mono",monospace;letter-spacing:.14em;text-transform:uppercase}
h1{max-width:780px;margin:12px 0 14px;font-size:clamp(36px,6vw,60px);line-height:1.05;letter-spacing:-.045em}
.lead{max-width:760px;margin:0;color:var(--muted);font-size:18px}
h2{margin:52px 0 14px;padding-top:18px;border-top:1px solid var(--line);font-size:24px;line-height:1.3}
h3{margin:0 0 8px;font-size:17px}
p{color:#304d74}
ul,ol{padding-left:22px}
li{margin-bottom:8px;color:#304d74}
.release-line{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 28px}
.release-line span{padding:5px 9px;border-radius:999px;color:var(--blue-dark);background:#eaf1ff;font:600 11px/1.4 "JetBrains Mono",monospace}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:20px 0}
.card,.callout{border:1px solid var(--line);border-radius:12px;background:#fff}
.card{padding:22px;color:inherit;text-decoration:none}
a.card:hover{border-color:var(--blue)}
.card p{margin-bottom:0}
.callout{margin:18px 0;padding:18px 20px;border-left:4px solid var(--blue);background:#fbfcff}
.callout strong{display:block;margin-bottom:4px}
.callout.ok{border-left-color:var(--green);background:#f3fbf7}
.callout.warn{border-left-color:#c67a00;background:#fff9ef}
.steps{counter-reset:step;list-style:none;padding:0}
.steps li{position:relative;min-height:56px;padding:18px 18px 18px 62px;border:1px solid var(--line);border-radius:10px;background:#fff}
.steps li::before{counter-increment:step;content:counter(step);position:absolute;left:18px;top:17px;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;color:#fff;background:var(--blue);font-weight:800}
.key-command-builder{margin:18px 0;padding:20px;border:1px solid #a9c5ef;border-radius:12px;background:#f7faff}
.key-label{display:block;margin-bottom:4px;font-weight:800}
.key-help,.single-key-note{margin:0 0 12px;color:var(--muted);font-size:13px}
.key-input{width:100%;min-height:50px;padding:11px 13px;border:1px solid #8ca8cf;border-radius:8px;color:var(--ink);background:#fff;font:500 15px/1.4 "JetBrains Mono",monospace}
.key-input[aria-invalid=true]{border-color:#b42318;box-shadow:0 0 0 1px #b42318}
.key-actions{margin:12px 0;display:flex;align-items:center;flex-wrap:wrap;gap:12px}
.copy-command{min-height:44px;padding:10px 16px;border:0;border-radius:8px;color:#fff;background:var(--blue);font:800 14px/1.2 Inter,sans-serif;cursor:pointer}
.copy-command:disabled{cursor:not-allowed;background:#9ea8be}
.key-status{min-height:22px;color:var(--muted);font-size:13px}
.key-status[data-state=valid],.key-status[data-state=copied]{color:var(--green)}
.key-status[data-state=invalid],.key-status[data-state=failed]{color:#b42318}
.footer{margin-top:70px;padding:24px 0;border-top:1px solid var(--line);color:var(--muted);font-size:13px}
@media(max-width:720px){.nav a:not(.dashboard){display:none}.grid{grid-template-columns:1fr}.page{padding-left:18px;padding-right:18px}.key-actions{align-items:stretch;flex-direction:column}.copy-command{width:100%}}