:root {
  --bg: #f5f4ef;
  --card: #ffffff;
  --text: #1e211f;
  --muted: #70756f;
  --line: #dedfd9;
  --accent: #1f6b57;
  --accent-2: #e8f1ed;
  --warn: #9a5a0a;
  --danger: #a13e3e;
  --shadow: 0 10px 30px rgba(33, 42, 37, .08);
}
* { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif;
}
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.app-shell { max-width: 860px; margin: 0 auto; padding: 18px 14px 80px; }
.site-header { display:flex; justify-content:space-between; align-items:center; padding: 8px 4px 18px; }
.brand { font-weight: 800; letter-spacing: .02em; }
.beta { font-size: 12px; color: var(--muted); border:1px solid var(--line); border-radius:999px; padding:5px 9px; background:#fff; }
.view { display:none; }
.view.active { display:block; }
.card { background:var(--card); border:1px solid var(--line); border-radius:22px; padding:24px; box-shadow:var(--shadow); }
.hero { padding: 34px 28px; }
h1 { font-size: clamp(32px, 6vw, 54px); line-height:1.15; margin:10px 0 16px; }
h2 { font-size: clamp(24px, 4vw, 34px); margin:0 0 18px; }
h3 { margin: 2px 0 0; font-size: 21px; }
.lead { color:var(--muted); font-size:17px; line-height:1.8; max-width:680px; }
.eyebrow, .step { color:var(--accent); font-weight:800; font-size:12px; letter-spacing:.08em; text-transform:uppercase; }
.note, .muted { color:var(--muted); font-size:13px; }
.primary, .secondary, .found {
  border:0; border-radius:14px; padding:13px 18px; font-weight:800;
}
.primary { background:var(--accent); color:white; }
.primary.big { width:100%; padding:17px 20px; font-size:17px; }
.secondary { background:#eef0ec; color:var(--text); }
.found { background:#f8e9e9; color:var(--danger); }
.mini-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:12px; }
.mini { box-shadow:none; padding:17px; border-radius:16px; }
.mini strong { display:block; margin-bottom:6px; }
.mini span { color:var(--muted); font-size:13px; line-height:1.5; }
.form-card { max-width:660px; margin: 0 auto; }
form { display:grid; gap:18px; }
label { display:grid; gap:7px; font-weight:700; font-size:14px; }
input, select, textarea {
  width:100%; border:1px solid #cfd3cd; border-radius:12px; padding:13px 14px; background:#fff; color:var(--text);
}
textarea { resize:vertical; line-height:1.6; }
input:focus, select:focus, textarea:focus { outline:3px solid rgba(31,107,87,.13); border-color:var(--accent); }
.two-col { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
fieldset { border:1px solid var(--line); border-radius:14px; padding:12px 14px 14px; }
legend { font-weight:800; font-size:13px; padding:0 6px; }
.radio { display:flex; grid-template-columns:auto 1fr; align-items:center; gap:8px; margin:7px 0; font-weight:500; }
.radio input { width:auto; }
.summary { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
.status-pill { display:inline-block; background:var(--accent-2); color:var(--accent); font-size:12px; font-weight:800; border-radius:999px; padding:6px 10px; margin-bottom:9px; }
.elapsed-wrap { text-align:right; min-width:150px; }
.elapsed-wrap span { display:block; color:var(--muted); font-size:12px; }
.elapsed-wrap strong { font-size:28px; }
#dashboardView > .card { margin-bottom:14px; }
.section-head { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:15px; }
.logic-tag { font-size:12px; font-weight:700; padding:6px 9px; border-radius:999px; background:#f5eee0; color:var(--warn); }
.priority-list { display:grid; gap:10px; }
.priority-item { border:1px solid var(--line); border-radius:15px; padding:15px; display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.priority-item strong { display:block; margin-bottom:4px; }
.priority-item small { color:var(--muted); line-height:1.45; }
.todo-list { display:grid; gap:8px; }
.todo { display:flex; align-items:center; gap:10px; padding:12px 4px; border-bottom:1px solid #eceee9; }
.todo:last-child { border-bottom:0; }
.todo input { width:18px; height:18px; }
.todo.done span { text-decoration:line-through; color:#929792; }

.todo-wrap { border-bottom:1px solid #eceee9; padding:4px 0 10px; }
.todo-wrap:last-child { border-bottom:0; }
.todo-wrap .todo { border-bottom:0; padding-bottom:8px; }
.service-info { margin:0 0 4px 32px; padding:12px 14px; background:#f7f8f5; border:1px solid var(--line); border-radius:12px; }
.service-info p { margin:0 0 9px; color:var(--muted); font-size:13px; line-height:1.6; }
.service-info small { display:block; margin-top:8px; color:#858a84; font-size:11px; line-height:1.45; }
.service-link { display:inline-block; color:var(--accent); font-weight:800; font-size:13px; text-decoration:none; }
.service-link:hover { text-decoration:underline; }
.todo-wrap.done .service-info { opacity:.62; }

.inline-form { grid-template-columns:1.2fr 1fr 1.5fr auto; gap:8px; }
.timeline { margin-top:15px; display:grid; gap:9px; }
.timeline-item { border-left:3px solid var(--accent); padding:8px 0 8px 12px; }
.timeline-item strong { display:block; font-size:14px; }
.timeline-item span { color:var(--muted); font-size:13px; }
.danger-zone { box-shadow:none; }
@media (max-width: 680px) {
  .mini-grid, .two-col, .inline-form { grid-template-columns:1fr; }
  .summary { flex-direction:column; }
  .elapsed-wrap { text-align:left; }
  .card { border-radius:18px; padding:19px; }
  .hero { padding:26px 20px; }
}
.hidden { display:none !important; }
.brand-button { border:0; padding:0; background:transparent; color:inherit; font:inherit; cursor:pointer; }
.notice { position:sticky; top:10px; z-index:20; margin:0 0 14px; border-radius:14px; padding:12px 15px; font-weight:700; background:#edf6f2; border:1px solid #cfe2d9; }
.notice.error { background:#fff0f0; border-color:#f0caca; color:#9a3434; }
.notice.success { background:#edf6f2; color:#1f6b57; }
label small { color:var(--muted); font-weight:500; line-height:1.5; }
.photo-preview { margin-top:-6px; }
.photo-preview img { display:block; width:180px; max-height:180px; object-fit:cover; border-radius:14px; border:1px solid var(--line); }
.copy-row { display:grid; grid-template-columns:1fr auto; gap:8px; align-items:center; }
.action-links label + label { margin-top:14px; }
.found-pill { background:#e9f4ec; color:#2e7040; }

.manage-photo-card { padding-top:20px; }
.manage-photo-card .eyebrow { margin:0 0 10px; }
.manage-photo {
  display:block;
  width:100%;
  max-height:520px;
  object-fit:contain;
  background:#f5f6f3;
  border-radius:16px;
}
.public-card { margin-bottom:14px; }
.public-photo { width:100%; max-height:520px; object-fit:contain; background:#f5f6f3; border-radius:16px; margin:10px 0 20px; }
.public-details dl { margin:0; display:grid; gap:0; }
.public-details dl div { display:grid; grid-template-columns:120px 1fr; gap:14px; padding:10px 0; border-bottom:1px solid var(--line); }
.public-details dt { color:var(--muted); font-size:13px; font-weight:700; }
.public-details dd { margin:0; font-weight:700; }
.alert-box { margin-top:18px; border-radius:14px; padding:14px 16px; background:#fff8e8; border:1px solid #eadcb8; line-height:1.65; }
.timeline-item small { display:block; margin-top:3px; color:#8a8f89; font-size:11px; }
.honeypot { position:absolute !important; left:-10000px !important; width:1px !important; height:1px !important; overflow:hidden !important; }
button:disabled { opacity:.55; cursor:not-allowed; }
@media (max-width:680px) {
  .copy-row { grid-template-columns:1fr; }
  .public-details dl div { grid-template-columns:1fr; gap:3px; }
}

.found-alert { background: #edf7f1; border-color: #c6e4d2; color: #24543b; }