body { font-family: system-ui, sans-serif; margin: 0 1rem; }
header { display: flex; gap: 1rem; padding: .5rem 0; border-bottom: 1px solid #ccc; }
header form.logout { margin-left: auto; }
form.login { display: grid; gap: .75rem; max-width: 20rem; }
form.login input { width: 100%; box-sizing: border-box; }
p.error { color: #b00020; }
table { border-collapse: collapse; width: 100%; }
th, td { border: 1px solid #ddd; padding: .25rem .5rem; text-align: left; vertical-align: top; }
.flag { background: #fff3cd; }
/* 物件の画面・ページの画面: 左（原本）と右（行の表）を、それぞれ独立にスクロールさせる */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; height: calc(100vh - 8.5rem); }
.pane { overflow: auto; min-height: 0; border: 1px solid #ccc; padding: 0 .5rem .5rem; }
.viewer .tools { position: sticky; top: 0; z-index: 1; background: #fff; padding: .5rem 0; }
.viewer figure { margin: 0 0 1rem; }
.viewer img { width: 100%; transform-origin: top left; }
.pane thead th { position: sticky; top: 0; background: #fff; }
form.inline { display: inline; }
.pane.csv { max-height: calc(100vh - 14rem); }
td.changed { background: #d6ecff; }
a.button { display: inline-block; padding: 0.2rem 0.6rem; border: 1px solid #888; border-radius: 4px; text-decoration: none; }
form.inline { display: inline; }