* { box-sizing: border-box; }
body { font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; background:#f4f5f7; margin:0; color:#1f2328; font-size:14px; }
a { color:#2563eb; }
.wrap { max-width:1100px; margin:0 auto; padding:0 16px; }
main.wrap { padding-top:28px; padding-bottom:40px; }

nav { background:#fff; border-bottom:1px solid #e5e7eb; }
nav .wrap { display:flex; align-items:center; gap:16px; height:54px; }
nav a { text-decoration:none; color:#1f2328; font-weight:500; }
nav a:hover { color:#2563eb; }
nav .sp { flex:1; }
nav .who { color:#666; font-size:13px; }

.card { max-width:560px; margin:0 auto 20px; background:#fff; border-radius:12px; padding:24px; box-shadow:0 2px 12px rgba(0,0,0,.06); }
.card.wide { max-width:none; }
.card.narrow { max-width:400px; margin-top:40px; }
h1 { font-size:20px; margin:0 0 4px; display:flex; gap:10px; align-items:center; }
h2 { font-size:16px; margin:0 0 12px; display:flex; gap:10px; align-items:center; }
p.sub { margin:0 0 16px; color:#666; }
p.foot { margin:16px 0 0; text-align:center; color:#666; }

label { display:block; font-size:13px; font-weight:600; margin:14px 0 6px; }
input, select { width:100%; padding:10px 12px; border:1px solid #d0d7de; border-radius:8px; font-size:15px; font-family:inherit; background:#fff; }
input:focus, select:focus { outline:none; border-color:#2563eb; box-shadow:0 0 0 3px rgba(37,99,235,.15); }
.mono, input.mono { font-family: ui-monospace, Menlo, Consolas, monospace; }

button { border:0; border-radius:8px; font-weight:600; cursor:pointer; font-family:inherit; }
button.primary { width:100%; margin-top:20px; padding:12px; font-size:15px; background:#2563eb; color:#fff; }
button.primary:hover { background:#1d4ed8; }
button.primary:disabled { opacity:.6; cursor:wait; }
button.small, .btnlink.small { padding:6px 12px; font-size:13px; background:#eef1f4; color:#1f2328; text-decoration:none; border-radius:8px; display:inline-block; }
button.go { background:#2563eb; color:#fff; }
button.danger { background:#fee2e2; color:#b91c1c; }
button.link { background:none; color:#b91c1c; padding:0; font-size:14px; }
form.inline { display:inline; }
.actions { white-space:nowrap; }
.actions form + form { margin-left:4px; }

.flash { padding:10px 14px; border-radius:8px; margin:0 auto 16px; max-width:560px; }
.card .flash { max-width:none; }
.flash.ok { background:#dcfce7; color:#166534; }
.flash.err { background:#fee2e2; color:#991b1b; }

.badge { display:inline-block; padding:2px 8px; border-radius:999px; font-size:12px; font-weight:600; background:#eef1f4; color:#444; }
.badge.ok { background:#dcfce7; color:#166534; }
.badge.err { background:#fee2e2; color:#991b1b; }
.badge.warn { background:#fef3c7; color:#92400e; }

.tablewrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; font-size:13px; }
th, td { text-align:left; padding:8px 6px; border-bottom:1px solid #eee; vertical-align:top; }
th { color:#666; font-weight:600; white-space:nowrap; }
tr.hl td { background:#fffbeb; }
details summary { cursor:pointer; color:#2563eb; }
pre.resp { background:#f6f8fa; padding:10px; border-radius:6px; white-space:pre-wrap; word-break:break-all; max-height:260px; overflow:auto; font-size:12px; margin:8px 0 0; }
.small { font-size:12px; color:#555; word-break:break-all; }

dl.kv { display:grid; grid-template-columns:100px 1fr; gap:6px 12px; margin:0 0 8px; }
dl.kv dt { color:#666; } dl.kv dd { margin:0; }
.errtxt { color:#b91c1c; }

.tabs { display:flex; gap:4px; margin-bottom:16px; border-bottom:1px solid #eee; }
.tabs a { padding:8px 14px; text-decoration:none; color:#666; border-bottom:2px solid transparent; }
.tabs a.on { color:#2563eb; border-color:#2563eb; font-weight:600; }
.filters { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; align-items:center; }
.filters input, .filters select { width:auto; padding:6px 10px; font-size:13px; }
.pager { display:flex; gap:16px; justify-content:center; margin-top:16px; align-items:center; }

@media (max-width:640px) {
  nav .wrap { flex-wrap:wrap; height:auto; padding:10px 16px; gap:10px; }
  nav .sp { display:none; }
}

.result { max-width:560px; margin:0 auto 20px; padding:18px 20px; border-radius:12px; }
.result.ok { background:#dcfce7; color:#166534; border:1px solid #86efac; }
.result.err { background:#fee2e2; color:#991b1b; border:1px solid #fca5a5; }
.result .big { font-size:20px; font-weight:700; margin-bottom:4px; }
.result .label { margin-top:12px; font-weight:600; }
.result pre.resp { background:#fff; color:#1f2328; }

.quota { background:#eef2ff; color:#3730a3; padding:8px 12px; border-radius:8px; font-size:13px; margin-bottom:4px; }
.quota.full { background:#fee2e2; color:#991b1b; }
.limitform { display:flex; gap:4px; align-items:center; }
.limitform input { width:80px; padding:5px 8px; font-size:13px; }
.muted { color:#888; font-size:12px; }