:root{
  --bg:#f6efe8;
  --panel:#ffffff;
  --line:#e7d8ca;
  --text:#2d211a;
  --muted:#796d63;
  --brand:#7a1f1f;
  --soft:#fff7ef;
  --accent:#c79a53;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif}
body{padding-bottom:82px}
a{text-decoration:none;color:inherit}
.app{max-width:430px;margin:0 auto;padding:12px}
.topbar{display:grid;gap:12px;margin-bottom:14px}
.brand-card{display:flex;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:12px}
.brand-card img{width:52px;height:52px;border-radius:16px;object-fit:cover}
.brand-title{font-size:1.3rem;font-weight:700}
.brand-sub{font-size:.92rem;color:var(--muted)}
.meta-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.meta-card,.panel,.link-card,.member-card,.feed-card,.month-card,.gallery-card{background:var(--panel);border:1px solid var(--line);border-radius:18px}
.meta-card{padding:10px;display:grid;gap:4px}
.meta-card span{font-size:.76rem;color:var(--muted)}
.meta-card strong{font-size:1rem}
.panel{padding:12px;margin-bottom:12px}
.section-head{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:10px}
.section-head h2{margin:0;font-size:1.08rem}
.section-head span{font-size:.78rem;color:var(--muted);text-align:right}
.today-list,.feed-list,.family-list,.calendar-list,.map-list{display:grid;gap:8px}
.mini-row{display:flex;align-items:center;gap:8px;padding:10px 0;border-bottom:1px solid #f0e6dd}
.mini-row:last-child{border-bottom:none}
.tag{display:inline-flex;padding:4px 8px;background:#f8eadc;color:var(--brand);border-radius:999px;font-size:.72rem;font-weight:700}
.birthdays-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:8px}
.person-card,.gallery-card{padding:10px;text-align:center}
.person-card img,.gallery-card img,.member-card img{width:72px;height:72px;border-radius:50%;object-fit:cover;background:#ead9c8}
.person-card h3,.member-card h3,.feed-card h3,.month-card h3,.link-card h3{margin:8px 0 4px;font-size:.96rem}
.person-card p,.member-card p,.feed-card p,.month-card p,.link-card p,.gallery-card p{margin:0;color:var(--muted);font-size:.82rem}
.action-btn,.ghost-btn{border:none;border-radius:999px;padding:8px 12px;font-size:.78rem;cursor:pointer}
.action-btn{background:var(--brand);color:#fff}
.ghost-btn{background:#fff;border:1px solid var(--line);color:var(--text)}
.feed-card,.link-card,.month-card,.member-card{padding:12px}
.feed-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.pill{padding:6px 10px;border-radius:999px;background:var(--soft);font-size:.74rem;border:1px solid var(--line)}
.bottom-nav{position:fixed;left:0;right:0;bottom:0;height:68px;background:#131313;display:flex;justify-content:center;z-index:40}
.bottom-nav .nav-inner{width:min(430px,100%);display:flex;justify-content:space-around;align-items:center}
.bottom-nav a{color:#fff;opacity:.82;font-size:.82rem;text-align:center;display:grid;gap:4px}
.bottom-nav a.active{opacity:1;color:#ffd27d}
.hero-note{font-size:.84rem;color:var(--muted)}
.family-list .link-card{display:flex;align-items:center;justify-content:space-between}
.family-members{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}
.calendar-months{display:grid;gap:10px}
.month-card .month-people{display:grid;gap:8px;margin-top:10px}
.month-person{display:flex;align-items:center;gap:10px;padding:8px;background:var(--soft);border:1px solid var(--line);border-radius:14px}
.month-person img{width:50px;height:50px;border-radius:50%;object-fit:cover;background:#ead9c8}
.gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.gallery-card img{width:100%;height:150px;border-radius:14px;object-fit:cover}
.map-list .link-card{display:grid;gap:4px}
.count{font-size:.8rem;color:var(--muted)}
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.5);display:none;align-items:flex-end;justify-content:center;padding:0;z-index:100}
.modal-backdrop.open{display:flex}
.modal{width:min(430px,100%);background:#fff;border-radius:24px 24px 0 0;padding:18px;max-height:85vh;overflow:auto}
.modal-top{display:flex;justify-content:space-between;gap:10px;align-items:start}
.modal-close{background:none;border:none;font-size:1.5rem;cursor:pointer}
.modal-profile{display:grid;justify-items:center;text-align:center;gap:10px}
.modal-profile img{width:120px;height:120px;border-radius:50%;object-fit:cover;background:#ead9c8}
.modal-actions{display:grid;gap:8px;margin-top:12px}
.modal-actions .pill{display:block;text-align:left}
.input{width:100%;padding:12px;border-radius:14px;border:1px solid var(--line);font:inherit}
.footer-note{font-size:.75rem;color:var(--muted);text-align:center;padding:8px}

.person-detail-card,.family-tree-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:12px;margin-bottom:12px}
.person-detail-grid{display:grid;grid-template-columns:92px 1fr;gap:12px;align-items:center}
.person-detail-grid img{width:92px;height:92px;border-radius:18px;object-fit:cover;background:#ead9c8}
.detail-meta{display:grid;gap:4px}
.tree-box{display:grid;gap:10px}
.tree-main{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.tree-node{min-width:110px;padding:10px;border:1px solid var(--line);background:var(--soft);border-radius:14px;text-align:center}
.tree-node strong{display:block}
.person-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}

/* V18 final polish */
body{line-height:1.35}
.panel{box-shadow:0 6px 18px rgba(80,45,20,.05)}
.brand-card,.meta-card,.panel,.link-card,.member-card,.feed-card,.month-card,.gallery-card,.person-detail-card,.family-tree-card{
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.link-card:hover,.member-card:hover,.gallery-card:hover,.person-card:hover,.month-person:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(80,45,20,.08);
}
.action-btn:hover,.ghost-btn:hover{filter:brightness(.98)}
input.input,textarea.input{background:#fff}
.empty-state{padding:14px;border:1px dashed var(--line);border-radius:16px;background:#fffaf5;color:var(--muted);text-align:center}
.info-banner{padding:10px 12px;border-radius:16px;background:#fff6e9;border:1px solid #edd8b8;color:#5d4630;font-size:.84rem;margin-bottom:12px}
.status-row{display:flex;gap:8px;flex-wrap:wrap}
.status-pill{padding:6px 10px;border-radius:999px;background:var(--soft);border:1px solid var(--line);font-size:.75rem}
@media (min-width:700px){
  .app{max-width:900px}
  .meta-grid{grid-template-columns:repeat(4,1fr)}
  .birthdays-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

.upload-category-grid{display:grid;gap:8px}


/* V23 Home Modals */
.home-open{cursor:pointer}
.home-open:hover{background:#fffaf5;border-radius:16px;padding:4px 6px;margin:-4px -6px}
.mini-cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px}
.bday-mini-card,.anniv-mini-card,.image-mini-card{
  background:var(--soft);
  border:1px solid var(--line);
  border-radius:16px;
  padding:10px;
  text-align:center;
}
.bday-mini-card img,.anniv-mini-card img,.image-mini-card img{
  width:70px;
  height:70px;
  border-radius:18px;
  object-fit:cover;
  background:#ead9c8;
}
.bday-mini-card h4,.anniv-mini-card h4,.image-mini-card h4{
  margin:8px 0 4px;
  font-size:.92rem;
}
.bday-mini-card p,.anniv-mini-card p,.image-mini-card p{
  margin:0;
  font-size:.78rem;
  color:var(--muted);
}


/* V24 fixed top header + info strip */
body{padding-top:166px !important;padding-bottom:82px;}
.app{padding-top:0 !important;}
.topbar{display:none !important}
.app-fixed-top{position:fixed;top:0;left:0;right:0;z-index:1200;background:#111;color:#fff;box-shadow:0 8px 18px rgba(0,0,0,.14);}
.app-top-inner{max-width:430px;margin:0 auto;padding:10px 12px 8px;}
.app-brand{display:flex;align-items:center;gap:12px;}
.app-brand-logo{width:46px;height:46px;border-radius:14px;background:#fff;object-fit:cover;}
.app-brand-row{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;}
.app-brand-main{font-size:1.35rem;font-weight:700;color:#fff;}
.app-brand-side{font-size:1rem;font-weight:700;color:#d14545;}
.app-brand-sub{font-size:.73rem;color:#c9c9c9;margin-top:2px;}
.app-info-strip{max-width:430px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 12px 10px;}
.info-mini-card{background:#1c1c1c;border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:8px 10px;}
.info-mini-label{font-size:.68rem;color:#c5c5c5;}
.info-mini-value{font-size:.95rem;font-weight:700;margin-top:2px;color:#fff;}
.info-mini-meta{font-size:.68rem;color:#bcbcbc;margin-top:2px;}
.sooriyan-card .info-mini-value{color:#ffd27d;}
@media (min-width:700px){body{padding-top:126px !important}.app-top-inner,.app-info-strip{max-width:900px}.app-info-strip{grid-template-columns:repeat(4,1fr)}}


/* V25 clean ready */
.footer-note{opacity:.75}
.section-head h2{letter-spacing:.01em}


/* V26 calendar detail */
.calendar-click{cursor:pointer}
.calendar-click:hover{transform:translateY(-1px)}
.day-detail-card{
  background:var(--soft);
  border:1px solid var(--line);
  border-radius:16px;
  padding:10px;
  display:flex;
  align-items:center;
  gap:10px;
}
.day-detail-card img{
  width:52px;
  height:52px;
  border-radius:50%;
  object-fit:cover;
  background:#ead9c8;
}
.day-detail-meta{display:grid;gap:2px}
.day-detail-meta strong{font-size:.92rem}
.day-detail-meta span{font-size:.78rem;color:var(--muted)}


/* V27 final linking */
.link-card{display:flex;align-items:center;justify-content:space-between;gap:10px}
.link-card h3{margin:0 0 4px 0}
.link-card p{margin:0}

/* V28 admin login */
.feed-card .input{margin-bottom:10px}
.lock-note{font-size:.78rem;color:var(--muted)}

/* V32 excel import + tree */
.tree-family-block{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:12px;margin-bottom:12px}
.tree-root{display:grid;gap:10px}
.tree-couple{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.tree-person{min-width:120px;background:var(--soft);border:1px solid var(--line);border-radius:14px;padding:10px;text-align:center}
.tree-person img{width:56px;height:56px;border-radius:50%;object-fit:cover;background:#ead9c8}
.tree-children{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px}


/* V35 final local ready */
.feed-card,.panel,.link-card,.tree-family-block{
  scroll-margin-top: 180px;
}
.bottom-nav a{
  font-weight:600;
}
.modal{
  box-shadow:0 -12px 28px rgba(0,0,0,.18);
}