/* 決算審査ボード — minimal, meaning-only colors */
:root {
  --ink: #1a202c; --sub: #718096; --line: #e2e8f0; --bg: #f7faf8;
  --card: #ffffff; --up: #c05621; --down: #2b6cb0; --accent: #276749;
}
* { box-sizing: border-box; }
body {
  margin: 0; font-family: -apple-system, "Hiragino Sans", "Noto Sans JP", sans-serif;
  color: var(--ink); background: var(--bg); font-size: 15px;
}
header {
  position: sticky; top: 0; z-index: 10; background: var(--card);
  border-bottom: 1px solid var(--line); padding: .5rem .9rem;
}
h1 { font-size: 1rem; margin: 0 0 .4rem; display: inline-block; }
#search {
  width: 100%; max-width: 480px; padding: .45rem .7rem; margin-top: .35rem;
  font-size: 1rem; border: 1px solid var(--line); border-radius: 8px;
}
nav { display: flex; gap: .25rem; margin-top: .45rem; flex-wrap: wrap; }
nav button {
  border: none; background: none; padding: .4rem .7rem; font-size: .92rem;
  border-radius: 8px 8px 0 0; cursor: pointer; color: var(--sub);
}
nav button.on { background: var(--accent); color: #fff; }
main { padding: .9rem; max-width: 1100px; margin: 0 auto; }
section.view { display: none; }
section.view.on { display: block; }

.kpis { display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap:.6rem; margin-bottom: 1rem; }
.kpi { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: .6rem .8rem; }
.kpi .lbl { font-size: .75rem; color: var(--sub); }
.kpi .val { font-size: 1.35rem; font-weight: 700; }
.kpi .sub { font-size: .75rem; color: var(--sub); }

.card { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: .8rem 1rem; margin-bottom: 1rem; }

.brow { display: grid; grid-template-columns: 5.5em 1fr auto; gap: .5rem; align-items: center; padding: .3rem 0; cursor: pointer; border-bottom: 1px dashed var(--line); }
.brow:last-child { border-bottom: none; }
.brow:hover { background: #f0fff4; }
.bname { font-weight: 600; }
.bars { display: flex; flex-direction: column; gap: 2px; }
.bar { height: 9px; border-radius: 2px; background: var(--accent); min-width: 2px; transition: width .3s; position: relative; }
.bar.old { opacity: .38; }
.badge { font-weight: 700; white-space: nowrap; }
.up { color: var(--up); } .down { color: var(--down); } .flat { color: var(--sub); }

table { width: 100%; border-collapse: collapse; background: var(--card); font-variant-numeric: tabular-nums; }
th, td { border: 1px solid var(--line); padding: .32rem .5rem; text-align: right; font-size: .85rem; }
th { background: #edf2f7; font-weight: 600; text-align: center; position: sticky; top: 86px; }
td:first-child, th:first-child { text-align: left; }
tr.mokurow { cursor: pointer; }
tr.mokurow:hover { background: #f0fff4; }
.unused { color: var(--sub); background: #edf2f7; }
.setsu { color: var(--sub); font-size: .82rem; }
.memo { font-size: .78rem; color: var(--sub); word-break: break-all; }
td.wrap { text-align: left; max-width: 420px; overflow-wrap: anywhere; }

.page-html { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 1rem 1.2rem; line-height: 1.65; overflow-x: auto; }
.page-html h1 { font-size: 1.25rem; } .page-html h2 { font-size: 1.08rem; margin-top: 1.4rem; }
.page-html table { margin: .6rem 0; }
.page-html th { position: static; }

#results { position: absolute; left: .9rem; right: .9rem; max-width: 720px; background: var(--card);
  border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 6px 20px rgba(0,0,0,.12);
  max-height: 55vh; overflow: auto; z-index: 30; display: none; }
.hit { padding: .5rem .8rem; border-bottom: 1px solid var(--line); cursor: pointer; }
.hit:hover { background: #f0fff4; }
.hit .t { font-weight: 600; }
.hit .d { font-size: .78rem; color: var(--sub); }
.tag { display: inline-block; font-size: .68rem; padding: 0 .4rem; border-radius: 4px; background: #edf2f7; color: var(--sub); margin-right: .35rem; vertical-align: middle; }

.note { font-size: .78rem; color: var(--sub); }
h2.sect { font-size: 1.02rem; border-left: 4px solid var(--accent); padding-left: .5rem; }

tr.mokurow.open td { background: #e6f4ea; }
tr.mokurow.open td:first-child { border-left: 3px solid var(--accent); font-weight: 700; }
.caret { display: inline-block; transition: transform .15s; color: var(--accent); }
tr.mokurow.open .caret { transform: rotate(90deg); }
