.web-hub{max-width:1100px;color:#182b49;font-size:15px}.web-hub h1{font-size:28px;font-weight:750}.web-hub h2{font-size:20px;font-weight:700}.hub-hero{background:#fff9e9 url('../images/web-home/header.webp') right center/cover;border-radius:24px;padding:42px 30px 54px;position:relative;overflow:hidden;margin-bottom:22px}.hub-hero:after{content:'';position:absolute;bottom:-30px;left:-5%;width:110%;height:55px;background:#fff;border-radius:50%}.hub-logo{width:min(450px,85%);height:auto;display:block;position:relative}.hub-hero p{font-size:17px;margin:12px 0 0;color:#3e526a}.hub-pulse{display:flex;align-items:center;gap:18px;padding:20px 22px;background:#edf3fa;border:1px solid #dce6f1;border-radius:18px;color:#234c78;margin-bottom:30px}.hub-pulse:hover{color:#193b62;background:#e5eef9}.hub-pulse h2{margin:0 0 6px}.hub-pulse p{margin:0;font-size:14px}.hub-pulse-icon{font-size:32px;color:#bc831f}.hub-subtitle,.hub-quick-heading p{color:#64748b;font-size:14px;margin:6px 0 20px}.hub-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.hub-card{position:relative;display:block;min-height:230px;background:var(--card-bg,#edf9f0);border:1px solid #ffffff90;border-radius:24px;padding:24px;box-shadow:0 8px 24px #193b6209;color:#182b49;transition:transform .18s,box-shadow .18s}.hub-card:hover{color:#182b49;transform:translateY(-3px);box-shadow:0 12px 30px #193b6216}.hub-card img,.hub-community-art{width:100%;height:170px;object-fit:contain;margin-bottom:16px}.hub-community-art{display:flex;align-items:center;justify-content:center;color:#13864c;background:radial-gradient(ellipse,#c9edd5 0%,transparent 65%);font-size:85px}.hub-card h2{font-size:22px;margin:0 0 8px}.hub-card p{font-size:14px;line-height:1.6;color:#52627a;max-width:85%;margin:0}.hub-arrow{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:#ffffffb0;color:var(--card-accent,#234c78);font-size:30px;flex-shrink:0}.hub-card .hub-arrow{position:absolute;bottom:20px;right:20px}.hub-pulse .hub-arrow{margin-left:auto}.hub-quick-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:30px}.hub-quick-heading p{margin-bottom:12px}.hub-button{display:inline-flex;gap:8px;align-items:center;justify-content:center;min-height:44px;border:1px solid #d9e3eb;border-radius:12px;background:#fff;color:#193b62;padding:10px 15px;font-size:14px;cursor:pointer}.hub-button:hover{background:#eff6ff;color:#193b62}.hub-button.primary,.hub-button.selected{background:#166534;border-color:#166534;color:#fff}.hub-button:disabled{opacity:.5;cursor:not-allowed}.hub-quick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.hub-quick-card{display:flex;align-items:center;flex-direction:column;justify-content:center;border-radius:20px;padding:20px;text-align:center;font-size:16px}.hub-quick-card img{width:100%;height:90px;object-fit:contain;margin-bottom:12px}.hub-hint{color:#64748b;font-size:13px;margin-top:16px}.hub-dialog{border:1px solid #dce6ef;border-radius:20px;padding:24px;width:min(580px,95vw);max-height:88vh;box-shadow:0 30px 80px #172b4933;color:#182b49}.hub-dialog::backdrop{background:#14253880}.hub-dialog-heading{display:flex;gap:14px;align-items:center;justify-content:space-between;margin-bottom:16px}.hub-dialog-heading h2{font-size:20px;margin:0}.hub-close{border:0;background:#f1f5f9;border-radius:50%;font-size:28px;min-width:44px;min-height:44px;color:#334155}.hub-dialog label{display:block;font-size:14px;margin:14px 0}.hub-dialog input:not([type=checkbox]),.hub-dialog select,.hub-dialog textarea{display:block;width:100%;border:1px solid #cdd9e5;border-radius:10px;padding:10px;margin-top:7px;min-height:44px}.hub-dialog textarea{min-height:90px}.hub-toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}.family-hero{border-radius:24px;padding:28px;background:linear-gradient(125deg,#166534,#197b66);color:white;margin-bottom:20px;overflow:hidden}.family-hero small{color:#bbf7d0;letter-spacing:1px}.family-hero h1{color:#fff;margin-top:12px;font-size:28px}.family-hero p{margin:10px 0 0;color:#e5fae9}.family-nav{margin-bottom:24px}.family-home-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.family-menu{display:flex;gap:14px;text-align:left;border:1px solid #dce8df;border-radius:18px;padding:20px;background:var(--tone,#f0fdf4);color:#182b49;min-height:116px;align-items:center}.family-menu i{font-size:24px;color:var(--accent,#166534);width:36px}.family-menu strong{font-size:17px;display:block;margin-bottom:5px}.family-menu p{font-size:13px;color:#52627a;margin:0;line-height:1.5}.family-limit{padding:14px 18px;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:14px;margin-bottom:22px;color:#166534}.family-row{border:1px solid #dce6ef;background:#fff;border-radius:16px;padding:18px;margin:12px 0;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}.family-row h3{font-size:18px;margin:0 0 6px}.family-row p{font-size:14px;color:#64748b;margin:5px 0}.family-viewport{width:100%;height:min(620px,70vh);overflow:auto;border:1px solid #d5e8db;border-radius:18px;background:radial-gradient(#c9dace 1px,transparent 1px) 0 0/20px 20px;position:relative}.family-canvas{position:relative;transform-origin:0 0}.family-canvas svg{position:absolute;inset:0;pointer-events:none}.family-node{position:absolute;border:2px solid #cbdcd1;background:#fff;box-shadow:0 5px 14px #16653412;border-radius:18px;padding:12px 8px;color:#182b49;text-align:center;cursor:pointer;overflow:hidden;font-size:12px}.family-node.focus{border-color:#16a34a;background:#f0fdf4}.family-node img,.family-avatar{width:54px;height:54px;border-radius:50%;object-fit:cover;display:block;margin:0 auto 6px;background:#dcfce7}.family-avatar{font-size:22px;line-height:54px;color:#166534}.family-node strong{display:block;font-size:13px;overflow-wrap:anywhere;line-height:1.3}.family-node small{display:block;font-size:11px;color:#64748b;margin-top:5px}.family-person-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.family-person-grid .family-row{margin:0;display:block}.family-detail-photo{max-width:170px;border-radius:18px;display:block;margin:10px 0}.family-copy{line-height:1.7;max-width:75ch}.family-feedback{color:#b91c1c;font-size:14px}
@media(max-width:600px){.web-hub h1{font-size:24px}.hub-hero{padding:32px 20px 42px}.hub-card{padding:18px;min-height:250px}.hub-card img,.hub-community-art{height:120px}.hub-card h2{font-size:19px}.hub-card p{font-size:13px;max-width:100%;padding-bottom:44px}.hub-grid{gap:12px}.hub-quick-grid{gap:9px}.hub-quick-card{padding:12px 7px;font-size:13px}.hub-quick-card img{height:70px}.hub-quick-heading{align-items:flex-start}.hub-quick-heading h2{font-size:19px}.family-home-grid{grid-template-columns:1fr}.family-hero{padding:22px}.family-hero h1{font-size:24px}.hub-dialog{padding:18px}.hub-pulse{padding:16px;gap:12px}.hub-pulse h2{font-size:18px}.hub-pulse p{font-size:13px}}
@media(max-width:350px){.hub-quick-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.hub-card{transition:none}.hub-card:hover{transform:none}}

.web-hub a.hub-card,.web-hub a.hub-pulse,.web-hub a.hub-quick-card{text-decoration:none}.web-hub button:focus-visible,.web-hub a:focus-visible{outline:3px solid #3387cf;outline-offset:3px}

.family-dialog label[hidden]{display:none}

.hub-hero{background-image:linear-gradient(90deg,rgba(255,249,233,.92),rgba(255,249,233,.65) 48%,rgba(255,249,233,.1)),url('../images/web-home/header.webp')}

.hub-quick-icon{display:flex;align-items:center;justify-content:center;width:100%;height:90px;margin-bottom:12px;font-size:64px;background:radial-gradient(ellipse,#c9edd5 0%,transparent 65%)}
@media(max-width:600px){.hub-quick-icon{height:70px;font-size:50px}}

.family-hero{background-color:#145537;background-image:linear-gradient(90deg,rgba(16,74,45,1) 0%,rgba(16,74,45,.96) 40%,rgba(16,74,45,.25) 70%,rgba(16,74,45,0) 85%),url('../images/genealogy/family-tree-hero-v1.webp');background-size:cover,auto 100%;background-position:center,right center;background-repeat:no-repeat;min-height:220px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.family-hero small,.family-hero h1,.family-hero p{max-width:60%}
@media(max-width:600px){.family-hero{min-height:250px;background-image:linear-gradient(90deg,rgba(16,74,45,.97),rgba(16,74,45,.9) 40%,rgba(16,74,45,.6) 77%,rgba(16,74,45,.42)),url('../images/genealogy/family-tree-hero-v1.webp')}.family-hero small,.family-hero h1,.family-hero p{max-width:100%}}

/* Main Home modules: shared dimensions, source order and keyboard order. */
.hub-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.hub-card{display:flex;flex-direction:column;min-width:0;min-height:0;padding:0;overflow:hidden;border:1px solid #dfe8e7;border-radius:20px}
.hub-card-art{aspect-ratio:1;width:100%;overflow:hidden;background:#fff}
.hub-card .hub-card-art img{width:100%;height:100%;object-fit:cover;margin:0;display:block}
.hub-module-icon{display:flex;align-items:center;justify-content:center;width:100%;height:100%;position:relative;background:radial-gradient(circle at 50% 45%,#ffffff 0%,var(--card-bg) 72%);color:var(--card-accent);font-size:clamp(54px,9vw,100px)}
.hub-pulse-sun{position:absolute;right:18%;top:19%;font-size:.55em;color:#d99a2b}
.hub-card-copy{position:relative;padding:18px 18px 20px;flex:1}
.hub-card .hub-card-copy h2{font-size:19px;line-height:1.35;margin:0 0 8px;padding-right:30px;overflow-wrap:normal}
.hub-card .hub-card-copy p{max-width:100%;font-size:13px;line-height:1.5;padding:0;margin:0;min-height:3em;color:#4c6073}
.hub-card .hub-arrow{width:28px;height:28px;font-size:24px;top:17px;right:12px;bottom:auto}
@media(min-width:992px){.hub-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.hub-card-management:last-child:nth-child(3n + 1){grid-column:2}}
@media(max-width:575px){.hub-grid{gap:12px}.hub-card{border-radius:16px}.hub-card-copy{padding:12px 10px 14px}.hub-card .hub-card-copy h2{font-size:15px;padding-right:20px;min-height:2.7em;margin-bottom:5px}.hub-card .hub-card-copy p{font-size:12px;line-height:1.45;min-height:4.35em}.hub-card .hub-arrow{width:22px;height:22px;right:7px;top:12px;font-size:20px}}

/* Give the single Pulse newspaper breathing room within the shared image slot. */
.hub-card[data-home-module="todays_pulse"] .hub-card-art img{transform:scale(.86);transform-origin:center}

/* My Listings management hub: independent of Home imagery and Family Tree heroes. */
.my-listings-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 32px;border:1px solid #dce7f3;border-radius:24px;background:linear-gradient(120deg,#edf5ff,#fff);margin-bottom:28px;overflow:hidden}
.my-listings-hero-copy{flex:1;min-width:0;max-width:560px}
.my-listings-hero h1{color:#193b62;margin:0 0 12px}
.my-listings-hero p{color:#52627a;line-height:1.65;margin:0}
.my-listings-hero-art{display:block;flex-shrink:0;width:32%;max-width:320px;height:auto;aspect-ratio:1;object-fit:contain;border-radius:18px}
.my-listings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.my-listings-option{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;min-width:0;min-height:205px;padding:28px 20px;text-align:center;text-decoration:none;color:#182b49;background:var(--card-bg);border:1px solid #dce6ef;border-radius:20px;box-shadow:0 6px 20px #193b6208;transition:transform .18s,box-shadow .18s}
.my-listings-option:hover{color:#182b49;text-decoration:none;transform:translateY(-2px);box-shadow:0 10px 28px #193b6214}
.my-listings-option-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:64px;height:64px;border-radius:18px;background:#fff;color:var(--card-accent);box-shadow:0 4px 12px #193b6208}
.my-listings-option-icon i{font-size:28px;line-height:1;width:auto}
.my-listings-option h2{font-size:20px;line-height:1.4;margin:0;max-width:100%;overflow-wrap:anywhere}
.my-listings-option-arrow{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;font-size:25px;line-height:1;background:#ffffffb0;color:var(--card-accent)}
.my-listings-option:focus-visible{outline:3px solid #3387cf;outline-offset:4px}
@media(max-width:575px){.my-listings-hero{padding:20px 16px;gap:12px;border-radius:20px}.my-listings-hero-art{width:30%;max-width:110px;border-radius:12px}.my-listings-hero p{font-size:13px}.my-listings-grid{gap:12px}.my-listings-option{padding:22px 12px;gap:12px;min-height:185px;border-radius:16px}.my-listings-option h2{font-size:16px}.my-listings-option-icon{width:56px;height:56px}.my-listings-option-icon i{font-size:25px}}
@media(prefers-reduced-motion:reduce){.my-listings-option{transition:none}.my-listings-option:hover{transform:none}}