:root{
  --bg:#f6f3ec; --card:#fffdf8; --ink:#26303a; --muted:#8a8378;
  --line:#e7e0d3; --accent:#1f6f6b; --accent-ink:#0f4a47; --warn:#b45309;
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans","Microsoft YaHei",sans-serif;
  background:var(--bg); color:var(--ink); line-height:1.6;
  -webkit-font-smoothing:antialiased; padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);
}
.wrap{max-width:640px; margin:0 auto; padding:20px 16px 64px}
.hd h1{font-size:26px; margin:8px 0 4px; letter-spacing:.5px}
.hd .loc{font-size:14px; color:#fff; background:var(--accent); padding:2px 10px; border-radius:20px; vertical-align:middle; margin-left:6px}
.sub{color:var(--muted); font-size:14px; margin:0 0 16px}
.card{background:var(--card); border:1px solid var(--line); border-radius:16px; padding:16px; margin:14px 0; box-shadow:0 1px 0 rgba(0,0,0,.02)}
textarea{width:100%; border:1px solid var(--line); border-radius:12px; padding:12px; font:inherit; color:inherit; background:#fff; resize:vertical}
textarea:focus{outline:none; border-color:var(--accent)}
.row{display:flex; gap:10px; margin-top:12px}
.btn{flex:1; display:inline-flex; align-items:center; justify-content:center; gap:6px;
  padding:14px 16px; border-radius:14px; border:1px solid var(--line); background:#fff;
  font-size:16px; font-weight:600; cursor:pointer; color:var(--ink)}
.btn.photo{background:#fff}
.btn.primary{background:var(--accent); color:#fff; border-color:var(--accent)}
.btn.primary:active{background:var(--accent-ink)}
.btn:disabled{opacity:.5}
.thumbs{display:flex; flex-wrap:wrap; gap:8px; margin-top:12px}
.thumb{position:relative; width:74px; height:74px; border-radius:10px; overflow:hidden; border:1px solid var(--line)}
.thumb img{width:100%; height:100%; object-fit:cover}
.thumb button{position:absolute; top:2px; right:2px; width:22px; height:22px; border:none; border-radius:50%;
  background:rgba(0,0,0,.55); color:#fff; font-size:14px; line-height:1; cursor:pointer}
.hint{font-size:13px; margin:10px 2px 0; min-height:18px}
.hint.ok{color:var(--accent-ink)} .hint.err{color:var(--warn)}
.timeline h2{font-size:16px; color:var(--muted); font-weight:600; margin:22px 2px 8px}
.entry{background:var(--card); border:1px solid var(--line); border-radius:14px; padding:12px 14px; margin:10px 0}
.entry .t{font-size:12px; color:var(--muted)}
.entry .x{white-space:pre-wrap; margin:6px 0 0}
.entry .pics{display:flex; flex-wrap:wrap; gap:6px; margin-top:8px}
.entry .pics img{width:88px; height:88px; object-fit:cover; border-radius:8px; border:1px solid var(--line)}
.empty{color:var(--muted); font-size:14px; text-align:center; padding:20px}
.locked p{margin:6px 0}