:root{
  --bg:#f6f4ef; --card:#fff; --ink:#24302f; --muted:#6b7674; --line:#e3dfd6;
  --accent:#2f7a6b; --accent-ink:#fff; --accent-soft:#e3f0ec; --warn:#b4432f; --warn-soft:#fbe9e5;
  --radius:12px;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#141a19; --card:#1d2524; --ink:#e7ecea; --muted:#9aa6a3; --line:#2e3937;
  --accent:#5fb7a3; --accent-ink:#0e1615; --accent-soft:#213430; --warn:#e9806c; --warn-soft:#3a2420;
}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,-apple-system,"Hiragino Sans","Noto Sans JP",sans-serif}
a{color:var(--accent)}
main{max-width:960px;margin:0 auto;padding:16px}
h1{font-size:1.7rem;line-height:1.25;margin:.2em 0 .5em}
h2{font-size:1.2rem;margin:0 0 .6em}

.top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  max-width:960px;margin:0 auto;padding:14px 16px}
.brand{font-weight:700;text-decoration:none;color:var(--ink)}
.brand span{color:var(--accent);font-weight:600}
.top nav{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.top nav a{text-decoration:none}
.lang{font-size:.8rem;color:var(--muted)} .lang.on{color:var(--ink);font-weight:700}

.foot{max-width:960px;margin:24px auto;padding:16px;display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:.9rem}

.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px;margin:0 0 16px}
.narrow{max-width:680px;margin-left:auto;margin-right:auto}
.center{text-align:center}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:720px){.grid2{grid-template-columns:1fr}}

.hero{padding:28px 4px 20px}
.lead{font-size:1.08rem;color:var(--muted);max-width:640px}
.muted{color:var(--muted)}
.note{font-size:.95rem;margin:.8em 0 0}

.btn{display:inline-block;background:var(--accent);color:var(--accent-ink);border:0;border-radius:999px;
  padding:11px 22px;font:inherit;font-weight:600;text-decoration:none;cursor:pointer}
.btn:hover{filter:brightness(1.07)}
.btn.small{padding:6px 14px;font-size:.9rem}
.btn.ghost{background:transparent;color:var(--accent);border:1px solid var(--accent)}
.btn.danger{background:var(--warn)}

.ticks{list-style:none;padding:0;margin:0}
.ticks li{padding-left:1.6em;position:relative;margin:.4em 0}
.ticks li::before{content:"✓";position:absolute;left:0;color:var(--accent);font-weight:700}
.steps{padding-left:1.3em} .steps li{margin:.4em 0}

.pay{display:grid;gap:12px}
.pay>div{background:var(--accent-soft);border-radius:10px;padding:12px 14px}
.pay strong{font-size:1.5rem;display:block;line-height:1.2}
.pay span{font-weight:600}
.pay p{margin:.3em 0 0;font-size:.92rem;color:var(--muted)}

.calc label{display:block;max-width:240px;margin-bottom:12px}
.calc table{width:100%;max-width:420px;border-collapse:collapse}
.calc td{padding:8px 0;border-bottom:1px solid var(--line)}
.calc td+td{text-align:right;font-variant-numeric:tabular-nums}
.calc .total td{font-weight:700;border-bottom:0;font-size:1.1rem}

.form fieldset{border:0;border-top:1px solid var(--line);padding:16px 0 4px;margin:0}
.form legend{font-weight:700;padding-right:8px}
.form label{display:block;margin:0 0 12px;font-size:.93rem}
input,select,textarea{display:block;width:100%;margin-top:4px;padding:9px 11px;font:inherit;color:var(--ink);
  background:var(--bg);border:1px solid var(--line);border-radius:8px}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:1px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.row.three{grid-template-columns:1fr 1fr 1fr}
@media (max-width:560px){.row,.row.three{grid-template-columns:1fr}}
.checks{display:flex;gap:20px;flex-wrap:wrap}
.checks label,.consent{display:flex;gap:8px;align-items:flex-start}
.checks input,.consent input{width:auto;margin-top:5px}
.consent{margin:16px 0}
.hp{position:absolute;left:-9999px}
.errors{background:var(--warn-soft);color:var(--warn);border-radius:8px;padding:8px 14px;margin-bottom:14px}
.errors p{margin:.3em 0}
.ok{color:var(--accent);font-weight:600}

.adminbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.filters{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:8px 0 14px;font-size:.92rem}
.filters a{text-decoration:none;color:var(--muted)} .filters a.on{color:var(--ink);font-weight:700}
.filters form{margin-left:auto;min-width:200px}
.tablewrap{overflow-x:auto}
.list{width:100%;border-collapse:collapse;font-size:.93rem}
.list th{text-align:left;color:var(--muted);font-weight:600;border-bottom:1px solid var(--line);padding:6px 8px}
.list td{border-bottom:1px solid var(--line);padding:8px;white-space:nowrap}
.list tr:hover td{background:var(--accent-soft);cursor:pointer}
.badge{font-size:.75rem;padding:2px 9px;border-radius:999px;background:var(--line);vertical-align:middle;font-weight:600}
.s-new{background:#f3d98b;color:#5a4400}.s-contacted{background:#cfe0f5;color:#1d3f66}
.s-visited{background:#e2d4f2;color:#43256a}.s-approved{background:var(--accent);color:var(--accent-ink)}
.s-inactive{background:var(--line);color:var(--muted)}
.details{display:grid;grid-template-columns:170px 1fr;gap:6px 16px;margin:0}
.details dt{color:var(--muted)} .details dd{margin:0}
@media (max-width:560px){.details{grid-template-columns:1fr}.details dd{margin-bottom:8px}}
.del{margin-top:14px;text-align:right}

.form label.consent{display:flex;gap:8px;align-items:flex-start;margin:16px 0}
.grid2{align-items:start}

/* photos */
.hint{font-size:.9rem;color:var(--muted);margin:.2em 0 .8em}
input[type=file]{padding:7px;background:transparent}
.previews{display:flex;gap:8px;flex-wrap:wrap;margin:-4px 0 12px}
.previews img{width:96px;height:72px;object-fit:cover;border-radius:6px;border:1px solid var(--line)}
.photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.photos figure{margin:0}
.photos img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px;border:1px solid var(--line);display:block}
.photos figcaption{display:flex;justify-content:space-between;align-items:center;font-size:.85rem;color:var(--muted);margin-top:4px}
.photos form{margin:0}
.linkbtn{background:none;border:0;padding:0;font:inherit;color:var(--warn);cursor:pointer;text-decoration:underline}

/* family page */
.addphotos{margin-top:16px}
.status-box{border-radius:10px;padding:12px 16px;margin-top:10px;background:var(--accent-soft)}
.status-box p{margin:.3em 0 0}
.s-new-soft,.s-contacted-soft{background:#fbf1d3;color:#4a3a00}
.s-visited-soft{background:#ece3f7;color:#3a2160}
.s-approved-soft{background:var(--accent-soft)}
.s-inactive-soft{background:var(--line);color:var(--muted)}
@media (prefers-color-scheme:dark){.s-new-soft,.s-contacted-soft{background:#3a321a;color:#f1dc9c}.s-visited-soft{background:#2e2540;color:#d9c8f2}}
.adminbar form{margin:0}