:root { --c1:#1a56a8; --bg:#f4f6f9; --line:#dde3ea; }
* { box-sizing: border-box; }
body { margin:0; font-family:"Hiragino Sans","Noto Sans JP","Yu Gothic",Meiryo,sans-serif; background:var(--bg); color:#1c2733; line-height:1.7; }
.wrap { max-width: 880px; margin: 0 auto; padding: 0 16px; }
.topbar { background:var(--c1); color:#fff; }
.topbar .wrap { display:flex; justify-content:space-between; align-items:center; height:52px; }
.brand { font-weight:bold; }
.topbar a { color:#fff; margin-left:14px; text-decoration:none; }
main { padding: 20px 16px 40px; }
h1 { font-size:1.35rem; } h2 { font-size:1.05rem; border-left:4px solid var(--c1); padding-left:8px; }
.card { background:#fff; border:1px solid var(--line); border-radius:10px; padding:18px 20px; margin:16px 0; }
.card.narrow { max-width:420px; margin:40px auto; }
.center { text-align:center; }
label { display:block; margin:10px 0; font-weight:600; }
input[type=text], input[type=password], select { width:100%; padding:10px; border:1px solid var(--line); border-radius:8px; font-size:1rem; }
input[type=file] { font-size:.95rem; }
.btn { display:inline-block; background:#fff; border:1px solid var(--c1); color:var(--c1); padding:9px 16px; border-radius:8px; font-size:.95rem; cursor:pointer; text-decoration:none; }
.btn.primary { background:var(--c1); color:#fff; }
.btn.danger { border-color:#c0392b; color:#c0392b; }
.btn.big { font-size:1.1rem; padding:14px 28px; width:100%; margin-top:10px; }
table { width:100%; border-collapse:collapse; margin-top:8px; }
th, td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--line); font-size:.92rem; vertical-align:top; }
th { background:#f0f3f7; }
table.kv th { width:200px; }
.badge { display:inline-block; padding:2px 10px; border-radius:999px; font-size:.8rem; color:#fff; }
.badge.ok { background:#2e8b57; } .badge.wait { background:#e67e22; }
.flash { background:#fdecea; border:1px solid #e74c3c; color:#a93226; padding:10px 14px; border-radius:8px; margin:12px 0; }
.muted { color:#66788c; font-size:.9rem; } .small { font-size:.8rem; }
.mono { font-family:ui-monospace,Menlo,Consolas,monospace; word-break:break-all; font-size:.82rem; }
.urlbox { background:#f0f3f7; border:1px dashed var(--c1); border-radius:8px; padding:12px; word-break:break-all; font-family:ui-monospace,monospace; margin:10px 0; }
.searchbar { display:flex; gap:8px; } .searchbar input { flex:1; } .searchbar select { width:auto; }
.grid button { margin-top:8px; }
.pdfframe { width:100%; height:420px; border:1px solid var(--line); border-radius:8px; }
#sigpad { width:100%; max-width:600px; height:200px; border:2px dashed #9db2c8; border-radius:8px; background:#fbfcfe; touch-action:none; }
.check { display:flex; gap:10px; align-items:flex-start; font-weight:400; }
.check input { margin-top:6px; transform:scale(1.4); }
.foot { color:#8a9bb0; font-size:.8rem; padding:20px 16px; }

/* ===== 種目タブ ===== */
.type-tabs{ display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 16px; }
.type-tab{ display:inline-flex; align-items:center; gap:6px; padding:7px 14px; border-radius:999px; border:2px solid #d0d7e2; background:#fff; color:#475569; font-weight:700; font-size:13px; text-decoration:none; transition:.15s; }
.type-tab:hover{ border-color:#2563eb; color:#2563eb; }
.type-tab.active{ background:#2563eb; border-color:#2563eb; color:#fff; }
.type-tab .cnt{ display:inline-block; min-width:20px; text-align:center; padding:1px 7px; border-radius:999px; background:rgba(0,0,0,.08); font-size:12px; }
.type-tab.active .cnt{ background:rgba(255,255,255,.25); }