:root{
  --linen: #EFE9DE;
  --surface: #F8F5EC;
  --ink: #2C2A26;
  --ink-soft: #5B564C;
  --gold: #A67C3D;
  --gold-deep: #8A652E;
  --moss: #6B7660;
  --rule: #D8CFBE;
  --shadow: rgba(44,42,38,0.08);
  --pending-bg: #FBF2E2;
  --pending-border: #E3C989;
}
*{box-sizing:border-box;}
body{
  margin:0;
  background:var(--linen);
  color:var(--ink);
  font-family:'Public Sans', sans-serif;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:640px;margin:0 auto;padding:0 20px 100px;}

.hero{padding:56px 0 40px;text-align:center;opacity:0;animation:rise 0.9s ease-out forwards;}
@keyframes rise{from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:translateY(0);}}
.sprig{margin:0 auto 22px; display:block;}
.cover-photo{width:132px;height:132px;border-radius:50%;object-fit:cover;margin:0 auto 24px;border:3px solid var(--surface);box-shadow:0 6px 18px var(--shadow);display:block;}
.cover-placeholder{width:132px;height:132px;border-radius:50%;margin:0 auto 24px;background:var(--surface);border:1px dashed var(--rule);display:flex;align-items:center;justify-content:center;color:var(--ink-soft); font-size:13px; cursor:pointer;}
.eyebrow{font-size:14px;color:var(--ink-soft);margin:0 0 6px;}
h1.name{font-family:'Fraunces', serif;font-optical-sizing:auto;font-weight:500;font-size:44px;line-height:1.1;margin:0 0 10px;cursor:text;outline:none;}
.dates{font-size:16px;color:var(--ink-soft);margin:0 0 26px;cursor:text;outline:none;}
.intro{font-size:17px;color:var(--ink-soft);max-width:480px;margin:0 auto;cursor:text;outline:none;}
.edit-hint{font-size:12px;color:var(--ink-soft);opacity:0.6;margin-top:18px;display:none;}
.admin-on .edit-hint{display:block;}
.admin-on h1.name, .admin-on .dates, .admin-on .intro{cursor:text;border:1px dashed var(--gold);border-radius:4px;padding:4px 10px;background:rgba(166,124,61,0.06);}
.admin-on h1.name{padding:4px 14px;}
body:not(.admin-on) h1.name, body:not(.admin-on) .dates, body:not(.admin-on) .intro{cursor:default;}
.admin-on h1.name:empty::before{content:attr(data-placeholder);color:var(--ink-soft);opacity:0.5;font-style:italic;}
.admin-on .dates:empty::before{content:attr(data-placeholder);color:var(--ink-soft);opacity:0.5;font-style:italic;}
.admin-on .intro:empty::before{content:attr(data-placeholder);color:var(--ink-soft);opacity:0.5;font-style:italic;}
.admin-on .cover-photo, .admin-on .cover-placeholder{position:relative;}
.admin-on #coverArea{position:relative;display:inline-block;}
.admin-on #coverArea:has(.cover-photo)::after{
  content:"Tap to change photo";
  position:absolute; bottom:20px; left:0; right:0;
  font-size:11px; color:#fff; background:rgba(44,42,38,0.65);
  padding:4px 0; border-radius:0 0 66px 66px;
  pointer-events:none;
}

.share-card{background:var(--surface);border:1px solid var(--rule);border-radius:6px;padding:28px 24px;margin-bottom:56px;}
.share-card h2{font-family:'Fraunces', serif;font-weight:500;font-size:22px;margin:0 0 6px;}
.share-card .sub{font-size:14px;color:var(--ink-soft);margin:0 0 18px;}
label{display:block;font-size:13px;color:var(--ink-soft);margin:16px 0 6px;}
label:first-of-type{margin-top:0;}
input[type=text], textarea, input[type=url], input[type=password]{width:100%;font-family:'Public Sans', sans-serif;font-size:15px;padding:11px 12px;border:1px solid var(--rule);border-radius:4px;background:#fff;color:var(--ink);}
textarea{resize:vertical;min-height:100px;}
input:focus, textarea:focus{outline:2px solid var(--gold);outline-offset:1px;}
.photo-row{display:flex;align-items:center;gap:12px;margin-top:8px;flex-wrap:wrap;}
.photo-btn{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--ink);background:#fff;border:1px solid var(--rule);border-radius:4px;padding:9px 14px;cursor:pointer;}
.photo-preview{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;}
.photo-preview img{width:64px;height:64px;object-fit:cover;border-radius:4px;border:1px solid var(--rule);}
.remove-photo{font-size:11px;color:var(--ink-soft);text-decoration:underline;cursor:pointer;margin-left:4px;}
.submit-btn{margin-top:22px;width:100%;background:var(--gold);color:#fff;border:none;border-radius:4px;padding:13px 18px;font-size:15px;font-weight:600;font-family:'Public Sans', sans-serif;cursor:pointer;transition:background 0.15s ease;}
.submit-btn:hover{background:var(--gold-deep);}
.submit-btn:disabled{background:var(--rule);cursor:default;}
.form-note{font-size:12px;color:var(--ink-soft);margin-top:10px;}
.shared-note{font-size:12px;color:var(--ink-soft);margin-top:14px;padding-top:14px;border-top:1px solid var(--rule);}

.feed-heading{font-family:'Fraunces', serif;font-weight:500;font-size:24px;margin:0 0 4px;}
.feed-count{font-size:14px;color:var(--ink-soft);margin:0 0 30px;}
.entry{padding:28px 0;border-top:1px solid var(--rule);}
.entry:last-child{border-bottom:1px solid var(--rule);}
.entry-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px;}
.entry-name{font-weight:600;font-size:15px;}
.entry-rel{font-weight:400;color:var(--ink-soft);}
.entry-time{font-size:12px;color:var(--ink-soft);white-space:nowrap;}
.entry-text{font-size:16px;color:var(--ink);white-space:pre-wrap;margin:0 0 12px;}
.entry-photos{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px;}
.entry-photos img{max-width:200px;max-height:240px;border-radius:4px;box-shadow:0 3px 10px var(--shadow);cursor:pointer;}
.entry-video a{font-size:14px;color:var(--gold-deep);}
.comments-section{margin-top:16px;padding-top:16px;border-top:1px dashed var(--rule);}
.comments-list{margin-bottom:14px;}
.comment{padding:10px 0 10px 14px;border-left:2px solid var(--rule);margin-bottom:8px;}
.comment-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;}
.comment-name{font-weight:600;font-size:13px;}
.comment-text{font-size:14px;color:var(--ink);margin:4px 0 0;white-space:pre-wrap;}
.comment-form{display:flex;flex-direction:column;gap:8px;}
.comment-form input, .comment-form textarea{font-size:13px;padding:8px 10px;}
.comment-form textarea{min-height:56px;}
.comment-submit-btn{align-self:flex-start;background:#fff;border:1px solid var(--rule);color:var(--ink);font-size:13px;padding:7px 14px;border-radius:4px;cursor:pointer;font-family:'Public Sans',sans-serif;}
.comment-submit-btn:hover{border-color:var(--gold);}
.comment-submit-btn:disabled{opacity:0.6;cursor:default;}
.comment-note{font-size:12px;color:var(--ink-soft);margin:0;}

.admin-comments{margin-top:14px;padding-top:14px;border-top:1px dashed var(--rule);}
.admin-comments-title{font-size:12px;color:var(--ink-soft);margin:10px 0 8px;}
.admin-comment{background:var(--pending-bg);border:1px solid var(--pending-border);border-radius:4px;padding:10px 12px;margin-bottom:8px;}
.admin-comment:not(.pending){background:#fff;border-color:var(--rule);}
.admin-comment .mod-actions{margin-top:8px;}
.admin-comment .mod-actions button{padding:6px 10px;font-size:12px;flex:none;}

.empty-state{text-align:center;padding:40px 0;color:var(--ink-soft);font-size:15px;}
.loading{text-align:center;padding:30px 0;color:var(--ink-soft);font-size:14px;}

.mod-toggle{
  position:fixed; bottom:16px; right:16px;
  background:var(--surface); border:1px solid var(--rule); color:var(--ink-soft);
  font-size:12px; padding:8px 12px; border-radius:20px; cursor:pointer;
  box-shadow:0 2px 8px var(--shadow); z-index:10;
}

.admin-overlay{position:fixed;inset:0;background:var(--linen);z-index:40;overflow-y:auto;}
.admin-wrap{max-width:640px;margin:0 auto;padding:24px 20px 80px;}
.admin-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;}
.admin-header h2{font-family:'Fraunces', serif;font-weight:500;font-size:26px;margin:0;}
.close-admin{font-size:13px;color:var(--ink-soft);background:none;border:1px solid var(--rule);border-radius:4px;padding:8px 12px;cursor:pointer;}
.admin-section-title{font-size:14px;color:var(--ink-soft);margin:28px 0 12px;padding-bottom:8px;border-bottom:1px solid var(--rule);}
.mod-card{background:var(--pending-bg);border:1px solid var(--pending-border);border-radius:6px;padding:18px;margin-bottom:14px;}
.mod-card.approved{background:var(--surface);border-color:var(--rule);}
.mod-photos{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0;}
.mod-photos span{position:relative;display:inline-block;}
.mod-photos img{width:76px;height:76px;object-fit:cover;border-radius:4px;border:1px solid var(--rule);}
.mod-photos .x{position:absolute;top:-6px;right:-6px;background:var(--ink);color:#fff;border-radius:50%;width:18px;height:18px;font-size:12px;line-height:18px;text-align:center;cursor:pointer;}
.mod-add-url{display:flex;gap:8px;margin-top:8px;}
.mod-add-url input{flex:1;font-size:13px;padding:8px 10px;}
.mod-add-url button{font-size:12px;padding:8px 12px;border:1px solid var(--rule);background:#fff;border-radius:4px;cursor:pointer;}
.mod-actions{display:flex;gap:10px;margin-top:14px;}
.mod-actions button{flex:1;padding:10px;font-size:14px;border-radius:4px;border:none;cursor:pointer;font-family:'Public Sans',sans-serif;font-weight:600;}
.btn-approve{background:var(--moss);color:#fff;}
.btn-reject{background:#fff;color:var(--ink-soft);border:1px solid var(--rule)!important;}
.btn-remove{background:#fff;color:var(--ink-soft);border:1px solid var(--rule)!important;width:100%;}

.login-box{max-width:320px;margin:80px auto;text-align:center;}
.login-box h2{font-family:'Fraunces', serif;font-weight:500;font-size:24px;}
.login-box p{font-size:14px;color:var(--ink-soft);}
.login-box input{margin-bottom:12px;}
.login-error{color:#a94442;font-size:13px;min-height:18px;}

.lightbox{position:fixed;inset:0;background:rgba(20,18,15,0.88);display:flex;align-items:center;justify-content:center;padding:24px;z-index:50;cursor:zoom-out;}
.lightbox img{max-width:100%;max-height:100%;border-radius:4px;}
.hidden{display:none;}

@media (max-width:420px){
  h1.name{font-size:34px;}
  .share-card{padding:22px 18px;}
}
