:root {
  --agenda-ink: #102c40;
  --agenda-green: #315d54;
  --agenda-gold: #b99858;
  --agenda-line: #cfdad7;
  --agenda-paper: #f4f7f5;
  --agenda-white: #fff;
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--agenda-ink); background: var(--agenda-paper); font-family: "Noto Sans JP", "Yu Gothic", sans-serif; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
[hidden] { display: none !important; }

.agenda-board { min-height: 100vh; }
.agenda-board-header {
  position: sticky; top: 0; z-index: 20; min-height: 76px; display: flex; align-items: center; gap: 24px;
  padding: 12px max(24px, calc((100vw - 1180px) / 2)); color: #fff;
  border-bottom: 1px solid rgba(255,255,255,.14); background: rgba(7,35,47,.96); backdrop-filter: blur(14px);
}
.agenda-board-brand { display: flex; flex-direction: column; color: #fff; line-height: 1.45; text-decoration: none; }
.agenda-board-brand small { color: rgba(255,255,255,.6); font-size: .62rem; }
.agenda-board-brand strong { font-family: "Noto Serif JP", serif; font-size: .92rem; letter-spacing: .04em; }
.agenda-board-header nav { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.agenda-board-header nav a, .agenda-board-header nav button {
  min-height: 42px; display: inline-flex; align-items: center; padding: 8px 12px; color: #fff;
  border: 1px solid rgba(255,255,255,.25); border-radius: 5px; background: transparent; font-size: .76rem; font-weight: 700; text-decoration: none; cursor: pointer;
}
.agenda-board-header nav a:hover, .agenda-board-header nav button:hover { background: rgba(255,255,255,.09); }

.agenda-board-main { width: min(1180px, calc(100% - 40px)); margin: 0 auto; padding: 58px 0 80px; }
.agenda-board-hero { display: flex; align-items: end; justify-content: space-between; gap: 32px; margin-bottom: 34px; padding-bottom: 30px; border-bottom: 1px solid var(--agenda-line); }
.agenda-board-kicker { margin: 0 0 9px; color: var(--agenda-green); font-size: .72rem; font-weight: 700; letter-spacing: .15em; }
.agenda-board-hero h1, .agenda-admin-side-head h1 { margin: 0; font-family: "Noto Serif JP", serif; font-weight: 700; }
.agenda-board-hero h1 { font-size: clamp(2.5rem, 6vw, 4.8rem); letter-spacing: .05em; }
.agenda-board-hero p:last-child { margin: 15px 0 0; color: #617078; }

.agenda-view-layout { display: grid; grid-template-columns: 280px minmax(0,1fr); gap: 28px; align-items: start; }
.agenda-months, .agenda-view-detail, .agenda-editor, .agenda-admin-sidebar { border: 1px solid var(--agenda-line); background: #fff; box-shadow: 0 18px 44px rgba(16,44,64,.06); }
.agenda-months { position: sticky; top: 100px; padding: 20px; }
.agenda-section-title { display: flex; align-items: end; justify-content: space-between; gap: 12px; padding-bottom: 15px; border-bottom: 1px solid var(--agenda-line); }
.agenda-section-title p { margin: 0; font-weight: 700; }
.agenda-section-title small { color: #748188; }
.agenda-month-card { width: 100%; display: grid; gap: 5px; margin-top: 10px; padding: 14px; color: var(--agenda-ink); border: 1px solid transparent; border-radius: 5px; background: #f5f8f6; text-align: left; cursor: pointer; }
.agenda-month-card small { color: #718087; font-size: .7rem; }
.agenda-month-card strong { font-size: .93rem; }
.agenda-month-card.is-active { color: #fff; border-color: var(--agenda-green); background: var(--agenda-green); }
.agenda-month-card.is-active small { color: rgba(255,255,255,.7); }

.agenda-view-detail { min-height: 480px; padding: clamp(25px,5vw,52px); }
.agenda-view-heading { padding-bottom: 26px; border-bottom: 3px solid var(--agenda-green); }
.agenda-view-heading .status { margin: 0 0 8px; color: var(--agenda-gold); font-size: .72rem; font-weight: 700; letter-spacing: .12em; }
.agenda-view-heading h2 { margin: 0; font-family: "Noto Serif JP", serif; font-size: clamp(2rem,5vw,3.7rem); letter-spacing: .05em; }
.agenda-view-meta { display: flex; flex-wrap: wrap; gap: 10px 24px; margin: 19px 0 0; padding: 0; }
.agenda-view-meta div { display: flex; gap: 8px; }
.agenda-view-meta dt { color: #718087; font-size: .75rem; }
.agenda-view-meta dd { margin: 0; font-size: .85rem; font-weight: 700; }
.agenda-view-intro { margin: 24px 0 0; color: #52636c; line-height: 1.9; white-space: pre-wrap; }
.agenda-view-item { display: grid; grid-template-columns: 52px 1fr; gap: 20px; padding: 30px 0; border-bottom: 1px solid var(--agenda-line); }
.agenda-view-item-number { width: 48px; height: 48px; display: grid; place-items: center; color: #fff; background: var(--agenda-green); font-family: "Noto Serif JP", serif; font-weight: 700; }
.agenda-view-item h3 { margin: 0; font-family: "Noto Serif JP", serif; font-size: 1.35rem; }
.agenda-view-item-body { margin: 13px 0 0; color: #52636c; line-height: 1.85; white-space: pre-wrap; }
.agenda-decision { margin-top: 18px; padding: 16px 18px; border-left: 3px solid var(--agenda-gold); background: #f8f5ed; }
.agenda-decision small { display: block; margin-bottom: 6px; color: #8b6f37; font-weight: 700; }
.agenda-decision p { margin: 0; line-height: 1.8; white-space: pre-wrap; }
.agenda-updated { margin: 24px 0 0; color: #718087; font-size: .72rem; text-align: right; }
.agenda-empty { min-height: 280px; display: grid; align-content: center; justify-items: center; padding: 34px; color: #6f7d84; text-align: center; }
.agenda-empty h2 { margin: 0; color: var(--agenda-ink); font-family: "Noto Serif JP", serif; }
.agenda-empty p { margin: 10px 0 0; }
.agenda-board-footer { padding: 26px 20px; color: rgba(255,255,255,.65); background: #071f2b; font-size: .72rem; text-align: center; }

.agenda-admin-main { min-height: calc(100vh - 76px); display: grid; grid-template-columns: minmax(300px,360px) minmax(0,1fr); }
.agenda-admin-sidebar { min-height: calc(100vh - 76px); padding: 28px; border-width: 0 1px 0 0; box-shadow: none; }
.agenda-admin-side-head { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding-bottom: 21px; border-bottom: 1px solid var(--agenda-line); }
.agenda-admin-side-head h1 { font-size: 1.55rem; }
.agenda-primary { min-height: 44px; padding: 9px 14px; color: #fff; border: 1px solid var(--agenda-green); border-radius: 5px; background: var(--agenda-green); font-weight: 700; cursor: pointer; }
.agenda-primary:hover { background: #244941; }
.agenda-create-form { display: grid; gap: 13px; margin: 18px 0; padding: 18px; border: 1px solid var(--agenda-line); background: #f5f8f6; }
.agenda-create-form h2 { margin: 0 0 3px; font-family: "Noto Serif JP", serif; font-size: 1.15rem; }
.agenda-create-form label, .agenda-meeting-form label, .agenda-item-editor label { display: grid; gap: 7px; color: #52636c; font-size: .74rem; font-weight: 700; }
.agenda-create-form input, .agenda-meeting-form input, .agenda-meeting-form select, .agenda-meeting-form textarea, .agenda-item-editor input, .agenda-item-editor textarea {
  width: 100%; min-height: 45px; padding: 10px 12px; color: var(--agenda-ink); border: 1px solid #b9c8c4; border-radius: 4px; background: #fff; outline: none;
}
.agenda-create-form input:focus, .agenda-meeting-form input:focus, .agenda-meeting-form select:focus, .agenda-meeting-form textarea:focus, .agenda-item-editor input:focus, .agenda-item-editor textarea:focus { border-color: var(--agenda-green); box-shadow: 0 0 0 3px rgba(49,93,84,.1); }
.agenda-form-pair, .agenda-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.agenda-create-actions { display: flex; gap: 8px; }
.agenda-create-actions button:not(.agenda-primary), .agenda-editor-actions button, .agenda-public-link button, .agenda-delete-item { min-height: 42px; padding: 8px 12px; color: var(--agenda-green); border: 1px solid rgba(49,93,84,.35); border-radius: 5px; background: #fff; font-weight: 700; cursor: pointer; }
.agenda-form-message { min-height: 1.5em; margin: 0; color: #a43b3b; font-size: .75rem; }
.agenda-admin-meeting-card { width: 100%; display: grid; gap: 6px; margin-top: 10px; padding: 14px; color: var(--agenda-ink); border: 1px solid var(--agenda-line); border-radius: 5px; background: #fff; text-align: left; cursor: pointer; }
.agenda-admin-meeting-card small { color: #718087; }
.agenda-admin-meeting-card.is-active { border-color: var(--agenda-green); background: #edf4f1; box-shadow: inset 3px 0 var(--agenda-green); }

.agenda-editor { min-height: calc(100vh - 76px); padding: clamp(24px,4vw,54px); border: 0; box-shadow: none; }
.agenda-editor-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-bottom: 22px; border-bottom: 1px solid var(--agenda-line); }
.agenda-editor-head h2 { margin: 3px 0 0; font-family: "Noto Serif JP", serif; font-size: clamp(1.7rem,3vw,2.5rem); }
.agenda-save-state { margin: 0; color: var(--agenda-green); font-size: .72rem; font-weight: 700; }
.agenda-save-state.is-saving { color: #8b6f37; }
.agenda-save-state.is-error { color: #a43b3b; }
.agenda-editor-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.agenda-meeting-form { display: grid; gap: 15px; margin-top: 26px; padding: 24px; border: 1px solid var(--agenda-line); background: #f7f9f8; }
.agenda-meeting-form textarea, .agenda-item-editor textarea { resize: vertical; line-height: 1.7; }
.agenda-public-link { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 16px; padding: 15px 18px; border: 1px solid #d8c79f; background: #faf7ef; }
.agenda-public-link div { min-width: 0; display: grid; gap: 4px; }
.agenda-public-link small { color: #8b6f37; }
.agenda-public-link a { overflow: hidden; color: var(--agenda-green); font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.agenda-items-head { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-top: 38px; padding-bottom: 14px; border-bottom: 3px solid var(--agenda-green); }
.agenda-items-head h3 { margin: 0; font-family: "Noto Serif JP", serif; font-size: 1.45rem; }
.agenda-items-head p { margin: 6px 0 0; color: #718087; font-size: .76rem; }
.agenda-item-editor { position: relative; display: grid; grid-template-columns: 50px minmax(0,1fr); gap: 18px; margin-top: 16px; padding: 22px; border: 1px solid var(--agenda-line); background: #fff; }
.agenda-item-number { width: 44px; height: 44px; display: grid; place-items: center; color: #fff; background: var(--agenda-green); font-family: "Noto Serif JP", serif; font-weight: 700; }
.agenda-item-fields { display: grid; gap: 13px; padding-right: 92px; }
.agenda-delete-item { position: absolute; top: 22px; right: 22px; min-height: 38px; color: #9a4040; border-color: rgba(154,64,64,.3); }

@media (max-width: 860px) {
  .agenda-view-layout, .agenda-admin-main { grid-template-columns: 1fr; }
  .agenda-months { position: static; }
  .agenda-admin-sidebar { min-height: auto; border-right: 0; border-bottom: 1px solid var(--agenda-line); }
  .agenda-editor { min-height: auto; }
}

@media (max-width: 620px) {
  .agenda-board-header { min-height: 70px; padding-inline: 16px; }
  .agenda-board-brand small { display: none; }
  .agenda-board-brand strong { font-size: .75rem; white-space: nowrap; }
  .agenda-board-header nav { gap: 4px; }
  .agenda-board-header nav a, .agenda-board-header nav button { min-height: 46px; padding-inline: 8px; font-size: .68rem; }
  .agenda-board-main { width: min(100% - 28px,1180px); padding-top: 38px; }
  .agenda-board-hero { margin-bottom: 22px; }
  .agenda-view-detail { padding: 24px 18px; }
  .agenda-view-item { grid-template-columns: 40px 1fr; gap: 13px; }
  .agenda-view-item-number { width: 38px; height: 38px; }
  .agenda-form-grid, .agenda-form-pair { grid-template-columns: 1fr; }
  .agenda-admin-side-head, .agenda-editor-head, .agenda-items-head { align-items: stretch; flex-direction: column; }
  .agenda-admin-sidebar, .agenda-editor { padding: 20px 16px; }
  .agenda-meeting-form { padding: 18px 14px; }
  .agenda-item-editor { grid-template-columns: 1fr; padding: 18px 14px; }
  .agenda-item-fields { padding-right: 0; }
  .agenda-delete-item { position: static; width: fit-content; }
  .agenda-public-link { align-items: stretch; flex-direction: column; }
}

@media print {
  .agenda-board-header, .agenda-months, .agenda-board-footer { display: none !important; }
  .agenda-board-main { width: 100%; padding: 0; }
  .agenda-view-layout { display: block; }
  .agenda-view-detail { border: 0; box-shadow: none; }
}