/* Family Vault identity inspired by the supplied brand board. */
:root,:root[data-theme="light"]{--bg:#fffdf7;--paper:#fff;--ink:#0f3d23;--muted:#607369;--green:#0f3d23;--light:#e8f5e9;--line:#dae9dd;--accent:#7fd970;--chrome:#fbfdf8;--soft:#edf7e9;--hero:#e8f5e9;--button-bg:#0f3d23;--button-hover:#176a3c;--button-ink:#fff}
:root{--brand-forest:#0f3d23;--brand-green:#2aa356;--brand-accent:#7fd970;--brand-light:#e8f5e9;--brand-warm:#fffdf7;--family-font:"Segoe UI Variable","Segoe UI",Arial,system-ui,sans-serif;font-family:var(--family-font)}
body{font-family:var(--family-font)}h1,h2,h3,.hero h2,.auth-story h1,.loading,.brand{font-family:var(--family-font);font-weight:700;letter-spacing:-.035em}h1{line-height:1.17}h3{letter-spacing:-.015em}.hero h2{font-size:36px;line-height:1.16}.auth-story h1{font-size:55px;line-height:1.12}.auth-form h2{font-size:30px}
.brand{padding:8px;border-radius:15px;background:#f8fcf4;display:flex;align-items:center;justify-content:center;flex-shrink:0}.brand.mobile-brand{display:none}.brand img{display:block;width:204px;height:auto;max-width:100%;object-fit:contain}.sidebar .brand{padding:8px;max-width:204px}.sidebar .brand img{width:188px;height:auto}.sidebar nav{min-height:0;overflow-y:auto;overscroll-behavior:contain;flex:1}.family-label{padding-bottom:18px}.auth-story>.brand{max-width:330px;align-self:flex-start}.auth-story>.brand img{width:310px;height:auto}.auth-form .mobile-brand img{width:220px;height:auto}
:root[data-theme="light"] .sidebar,:root[data-theme="light"] .topbar{background:var(--chrome)}:root[data-theme="light"] .nav-button{color:var(--muted)}:root[data-theme="light"] .nav-button.active{background:var(--light);color:var(--brand-forest);box-shadow:inset 3px 0 0 var(--brand-green)}:root[data-theme="light"] .nav-button:hover{background:var(--light)}
:root[data-theme="light"] .hero,:root[data-theme="light"] .auth-story,:root[data-theme="light"] .plan-intro{background:linear-gradient(135deg,#e8f5e9,#f6faed);border-color:var(--line)}:root[data-theme="light"] .hero p,:root[data-theme="light"] .auth-story>div>p{color:#4d6a56}:root[data-theme="light"] .button:not(.secondary):not(.ghost):not(.danger){background:var(--button-bg);color:#fff}:root[data-theme="light"] .button:not(.secondary):not(.ghost):not(.danger):hover{background:var(--button-hover)}:root[data-theme="light"] .button.secondary{color:var(--ink);border-color:var(--line)}:root[data-theme="light"] :is(.tag,.badge,.avatar,.empty-mark){background:var(--light);color:#25633b}:root[data-theme="light"] .badge.neutral{background:var(--soft);color:var(--muted)}
:is(.panel,.photo-card,.album-card,.recent-import>summary,.timeline-entry>summary){border-radius:16px;box-shadow:0 3px 15px #0f3d2305}.button{border-radius:11px}.search{border-radius:13px}:root[data-theme="light"] .search{background:var(--soft)}:root[data-theme="light"] .landscape{background:linear-gradient(150deg,#eff8e7,#c2e5b8)}:root[data-theme="light"] .landscape:before{background:#419f5b}:root[data-theme="light"] .landscape:after{background:#82bd6e}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline-color:var(--accent)}
@media(max-width:1000px){.hero h2{font-size:30px}.auth-story h1{font-size:43px}.auth-story>.brand{max-width:275px}}
@media(max-width:800px){.sidebar .brand{max-width:185px;padding:6px}.sidebar .brand img{width:170px;height:auto}.sidebar nav{display:flex;flex:initial;overflow-x:auto;overflow-y:hidden;min-height:42px}.auth-form .mobile-brand{display:flex;max-width:260px}.hero h2{font-size:27px}.page-heading h1{font-size:31px}}
