.os-auth-pending body{visibility:hidden}

/* ==========================================================================
   OUR STORY — COMPLETE SITE EXTENSIONS
   Uses the approved Foundation v2 cream / charcoal / gold design.
   ========================================================================== */
.os-page-hero{
  margin:18px 0 18px;
  padding:26px 30px;
  border:1px solid var(--line);
  border-radius:18px;
  background:
    radial-gradient(circle at 90% 15%,rgba(198,146,43,.13),transparent 17rem),
    color-mix(in srgb,var(--cream-2) 96%,transparent);
  box-shadow:var(--shadow);
}
.os-page-hero__eyebrow{
  color:var(--gold);font-family:var(--serif);font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;font-size:.76rem;margin:0 0 8px;
}
.os-page-hero h1{font-family:var(--serif);font-size:clamp(2.25rem,4vw,3.55rem);font-weight:500;letter-spacing:-.035em;margin:0 0 10px}
.os-page-hero p{max-width:780px;margin:0;color:var(--muted);line-height:1.7}
.os-panel{border:1px solid var(--line);background:color-mix(in srgb,var(--cream-2) 96%,transparent);border-radius:14px;box-shadow:var(--shadow);padding:22px}
.os-grid{display:grid;gap:14px}
.os-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.os-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.os-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.os-card{border:1px solid var(--line);background:color-mix(in srgb,var(--cream-2) 97%,transparent);border-radius:13px;box-shadow:var(--shadow);padding:18px;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.os-card:hover,.os-card:focus-within{transform:translateY(-4px);box-shadow:0 14px 30px rgba(78,55,22,.14);border-color:rgba(194,143,45,.56)}
.os-card h2,.os-card h3{font-family:var(--serif);margin:.25rem 0 .4rem}.os-card p{color:var(--muted);line-height:1.55;margin:.15rem 0}
.os-card__icon{font-size:1.9rem;color:var(--gold)}
.os-card__link{display:inline-block;color:#a66f13;font-family:var(--serif);font-weight:700;margin-top:12px}
.os-section-title{font-family:var(--serif);font-size:1.55rem;margin:26px 0 12px}
.os-placeholder-photo{
  min-height:180px;border:1px dashed rgba(166,111,19,.35);border-radius:12px;
  display:grid;place-items:center;text-align:center;padding:18px;color:var(--muted);
  background:linear-gradient(135deg,rgba(205,178,125,.12),rgba(255,255,255,.08));
}
.os-memory-photo{
  width:100%;height:210px;object-fit:cover;border-radius:10px;
  filter:sepia(.26) saturate(.78);border:5px solid #f9f2e4;outline:1px solid rgba(120,84,34,.25);
  box-shadow:0 8px 20px rgba(66,43,15,.15)
}
.os-room-list .os-card{min-height:178px}
.os-room-number{display:inline-grid;place-items:center;width:38px;height:38px;border:1px solid rgba(198,146,43,.42);border-radius:50%;color:var(--gold);font-family:var(--serif);font-weight:700}
.os-badge{display:inline-flex;align-items:center;border:1px solid rgba(198,146,43,.35);background:rgba(198,146,43,.08);color:#93620d;padding:5px 9px;border-radius:999px;font-size:.75rem;font-weight:700}
.os-form{display:grid;gap:14px}.os-field{display:grid;gap:6px}.os-field label{font-family:var(--serif);font-weight:700}
.os-field input,.os-field textarea,.os-field select{
  width:100%;border:1px solid var(--line);background:var(--cream-2);color:var(--ink);border-radius:10px;padding:12px 13px;font:inherit
}
.os-field textarea{min-height:120px;resize:vertical}
.os-button{border:0;background:linear-gradient(180deg,#d9a843,#c48e24);color:white;border-radius:11px;padding:11px 16px;font-family:var(--serif);font-weight:700;cursor:pointer;box-shadow:0 7px 16px rgba(167,117,24,.18)}
.os-button--ghost{background:transparent;color:var(--ink);border:1px solid var(--line);box-shadow:none}
.os-note{border-left:3px solid var(--gold);background:rgba(198,146,43,.07);padding:12px 14px;border-radius:0 9px 9px 0;color:var(--muted);line-height:1.55}
.os-status{min-height:1.5em;color:var(--muted);font-size:.9rem}
.os-timeline{position:relative;margin:10px 0 28px;padding-left:24px}.os-timeline:before{content:"";position:absolute;left:7px;top:4px;bottom:4px;width:2px;background:rgba(198,146,43,.35)}
.os-timeline__item{position:relative;padding:0 0 22px 20px}.os-timeline__item:before{content:"";position:absolute;left:-22px;top:5px;width:11px;height:11px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px var(--cream)}
.os-timeline__year{font-family:var(--serif);font-weight:700;color:#a66f13}.os-timeline__item h3{font-family:var(--serif);margin:3px 0 6px}.os-timeline__item p{margin:0;color:var(--muted);line-height:1.55}
.os-message{padding:15px 16px;border:1px solid var(--line);border-radius:12px;background:var(--cream-2);margin-bottom:10px}.os-message__meta{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:.78rem;margin-bottom:6px}.os-message p{margin:0;line-height:1.55}
.os-vault-list{display:grid;gap:10px}.os-vault-item{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:11px;padding:14px;background:var(--cream-2)}.os-vault-item strong{font-family:var(--serif)}
.os-login-wrap{min-height:calc(100vh - 80px);display:grid;place-items:center;padding:24px}.os-login-card{width:min(520px,100%);border:1px solid var(--line);background:var(--cream-2);border-radius:20px;box-shadow:0 18px 50px rgba(55,39,18,.14);padding:30px}.os-login-card .os-logo{width:250px;margin:0 auto 8px;color:#c6922b}.os-login-card .os-logo__word{fill:var(--ink)}.os-login-card h1{text-align:center;font-family:var(--serif);font-size:2rem;margin:0 0 8px}.os-login-card>p{text-align:center;color:var(--muted);line-height:1.55}
.os-public-shell{min-height:100vh;background:radial-gradient(circle at 80% 10%,rgba(198,146,43,.14),transparent 24rem),var(--cream);display:grid;grid-template-rows:auto 1fr auto}
.os-public-header{display:flex;align-items:center;justify-content:space-between;padding:16px 28px;border-bottom:1px solid var(--line)}.os-public-header .os-logo{width:210px;color:#c6922b}.os-public-header .os-logo__word{fill:var(--ink)}
.os-public-actions{display:flex;align-items:center;gap:10px}.os-public-main{width:min(1140px,calc(100% - 36px));margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;padding:42px 0}.os-public-copy h1{font-family:var(--serif);font-weight:500;font-size:clamp(3rem,6vw,5.4rem);line-height:.98;letter-spacing:-.045em;margin:0}.os-public-copy p{font-size:1.06rem;line-height:1.7;color:var(--muted);max-width:560px}.os-public-image{height:500px;border-radius:24px;background:url('../images/family-memory-hero-personal.jpg') center/cover;box-shadow:var(--shadow)}
.os-private-gate{position:fixed;inset:0;background:rgba(15,15,13,.72);backdrop-filter:blur(8px);z-index:9998;display:grid;place-items:center;padding:20px}.os-private-gate[hidden]{display:none}.os-private-gate__card{width:min(480px,100%);background:var(--cream-2);color:var(--ink);border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:0 24px 70px rgba(0,0,0,.3);text-align:center}
.os-private-gate__card h2{font-family:var(--serif);margin-top:0}
.os-small{font-size:.82rem;color:var(--muted);line-height:1.5}
.os-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.os-gallery figure{margin:0;border:1px solid var(--line);padding:9px;border-radius:11px;background:var(--cream-2);box-shadow:var(--shadow)}.os-gallery figcaption{padding:8px 3px 2px;color:var(--muted);font-size:.84rem}
@media(max-width:1000px){.os-grid--4{grid-template-columns:repeat(2,1fr)}.os-grid--3{grid-template-columns:repeat(2,1fr)}.os-public-main{grid-template-columns:1fr}.os-public-image{height:380px}.os-gallery{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.os-grid--2,.os-grid--3,.os-grid--4,.os-gallery{grid-template-columns:1fr}.os-page-hero{padding:20px}.os-public-header{padding:10px 14px}.os-public-header .os-logo{width:160px}.os-public-main{padding:24px 0}.os-public-image{height:280px}.os-login-card{padding:22px}}
@media(prefers-reduced-motion:reduce){.os-card{transition:none}.os-card:hover,.os-card:focus-within{transform:none}}

.os-preview-banner{position:fixed;right:16px;bottom:16px;z-index:9999;background:#1c1c1a;color:#f0cf82;border:1px solid rgba(214,170,76,.5);border-radius:999px;padding:7px 11px;font-size:.72rem;box-shadow:0 8px 20px rgba(0,0,0,.18)}

.os-profile-placeholder{display:grid;justify-items:center;gap:12px;text-align:center;padding:10px}
.os-profile-placeholder__image{
  width:170px;height:170px;border-radius:50%;display:grid;place-items:center;
  border:2px dashed rgba(166,111,19,.45);background:linear-gradient(135deg,rgba(205,178,125,.12),rgba(255,255,255,.1));
  color:var(--gold);font-size:3rem;font-family:var(--serif)
}
.os-profile-placeholder p{margin:0;color:var(--muted);line-height:1.5}


/* --------------------------------------------------------------------------
   Approved photo-placeholder interaction
   Applies across Rooms, Albums and Public Gallery.
   -------------------------------------------------------------------------- */
.os-placeholder-photo{
  cursor:pointer;
  transition:
    transform .2s ease,
    box-shadow .2s ease,
    border-color .2s ease,
    background-color .2s ease;
}
.os-placeholder-photo:hover,
.os-placeholder-photo:focus-visible{
  transform:translateY(-4px);
  border-color:rgba(194,143,45,.66);
  background:linear-gradient(
    135deg,
    rgba(205,178,125,.20),
    rgba(255,255,255,.14)
  );
  box-shadow:
    0 13px 26px rgba(78,55,22,.15),
    inset 0 0 0 1px rgba(198,146,43,.12);
  outline:none;
}
.os-gallery figure:hover{
  border-color:rgba(194,143,45,.42);
  box-shadow:0 12px 28px rgba(78,55,22,.12);
}
.os-gallery figure{
  transition:box-shadow .2s ease,border-color .2s ease;
}

@media(prefers-reduced-motion:reduce){
  .os-placeholder-photo,
  .os-gallery figure{transition:none}
  .os-placeholder-photo:hover,
  .os-placeholder-photo:focus-visible{transform:none}
}

/* Full-screen family photo viewer / gentle book-page transition */
.os-photo-viewer[hidden]{display:none}
.os-photo-viewer{
  position:fixed;inset:0;z-index:10000;
  display:grid;grid-template-rows:auto 1fr auto;
  background:rgba(20,18,14,.92);backdrop-filter:blur(8px);
  color:#f8f2e7;padding:18px;
}
.os-photo-viewer__top{display:flex;justify-content:flex-end}
.os-photo-viewer__close,.os-photo-viewer__nav{
  border:1px solid rgba(220,183,101,.5);background:rgba(30,27,22,.76);
  color:#f6dfaa;border-radius:999px;cursor:pointer;
}
.os-photo-viewer__close{width:46px;height:46px;font-size:1.6rem}
.os-photo-viewer__stage{
  min-height:0;display:grid;grid-template-columns:64px minmax(0,1fr) 64px;
  align-items:center;gap:16px;perspective:1500px;
}
.os-photo-viewer__nav{width:54px;height:54px;font-size:2rem}
.os-photo-viewer__page{
  justify-self:center;width:min(100%,1050px);height:min(72vh,760px);
  border-radius:8px;background:#eee7d8;
  box-shadow:0 30px 80px rgba(0,0,0,.45);
  overflow:hidden;transform-origin:left center;
  display:grid;place-items:center;
}
.os-photo-viewer__page img{
  display:block;width:100%;height:100%;object-fit:contain;background:#15130f;
}
.os-photo-viewer__placeholder{
  color:#7b6540;text-align:center;font-family:var(--serif);
  font-size:clamp(1.4rem,3vw,2.4rem);padding:30px;
}
.os-photo-viewer__caption{
  text-align:center;min-height:42px;padding:10px 12px 0;
  font-family:var(--serif);font-size:1.05rem;color:#f1dfb8;
}
.os-photo-viewer__page.turn-next{animation:osPageNext .48s ease both}
.os-photo-viewer__page.turn-prev{animation:osPagePrev .48s ease both}
@keyframes osPageNext{
  0%{transform:rotateY(0deg);opacity:1}
  48%{transform:rotateY(-48deg);opacity:.72}
  49%{transform:rotateY(48deg);opacity:.72}
  100%{transform:rotateY(0deg);opacity:1}
}
@keyframes osPagePrev{
  0%{transform:rotateY(0deg);opacity:1}
  48%{transform:rotateY(48deg);opacity:.72}
  49%{transform:rotateY(-48deg);opacity:.72}
  100%{transform:rotateY(0deg);opacity:1}
}
@media(max-width:700px){
  .os-photo-viewer{padding:10px}
  .os-photo-viewer__stage{grid-template-columns:44px minmax(0,1fr) 44px;gap:7px}
  .os-photo-viewer__nav{width:42px;height:42px;font-size:1.5rem}
  .os-photo-viewer__page{height:min(70vh,620px)}
}
@media(prefers-reduced-motion:reduce){
  .os-photo-viewer__page.turn-next,.os-photo-viewer__page.turn-prev{animation:none}
}

/* --------------------------------------------------------------------------
   Gentle edge-curl page turn
   -------------------------------------------------------------------------- */
.os-photo-viewer__page{
  position:relative;
  transform-style:preserve-3d;
  backface-visibility:hidden;
  overflow:hidden;
}
.os-photo-viewer__page::before,
.os-photo-viewer__page::after{
  content:"";
  position:absolute;
  top:0;bottom:0;
  width:18%;
  pointer-events:none;
  opacity:0;
}
.os-photo-viewer__page::before{
  right:0;
  background:linear-gradient(
    90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,247,226,.18) 28%,
    rgba(255,255,255,.72) 48%,
    rgba(78,52,23,.18) 62%,
    rgba(32,22,10,.42) 100%
  );
  transform-origin:right center;
}
.os-photo-viewer__page::after{
  right:-2%;
  background:radial-gradient(
    ellipse at left center,
    rgba(0,0,0,.34) 0%,
    rgba(0,0,0,.16) 28%,
    rgba(0,0,0,0) 70%
  );
}

.os-photo-viewer__page.turn-next{
  animation:osCurlNext .72s cubic-bezier(.34,.02,.18,1) both;
}
.os-photo-viewer__page.turn-next::before{
  animation:osCurlFoldNext .72s cubic-bezier(.34,.02,.18,1) both;
}
.os-photo-viewer__page.turn-next::after{
  animation:osCurlShadowNext .72s cubic-bezier(.34,.02,.18,1) both;
}

.os-photo-viewer__page.turn-prev{
  animation:osCurlPrev .72s cubic-bezier(.34,.02,.18,1) both;
}
.os-photo-viewer__page.turn-prev::before{
  left:0;right:auto;
  background:linear-gradient(
    270deg,
    rgba(255,255,255,0) 0%,
    rgba(255,247,226,.18) 28%,
    rgba(255,255,255,.72) 48%,
    rgba(78,52,23,.18) 62%,
    rgba(32,22,10,.42) 100%
  );
  transform-origin:left center;
  animation:osCurlFoldPrev .72s cubic-bezier(.34,.02,.18,1) both;
}
.os-photo-viewer__page.turn-prev::after{
  left:-2%;right:auto;
  background:radial-gradient(
    ellipse at right center,
    rgba(0,0,0,.34) 0%,
    rgba(0,0,0,.16) 28%,
    rgba(0,0,0,0) 70%
  );
  animation:osCurlShadowPrev .72s cubic-bezier(.34,.02,.18,1) both;
}

@keyframes osCurlNext{
  0%   {transform:perspective(1600px) rotateY(0deg) scale(1); filter:brightness(1)}
  22%  {transform:perspective(1600px) rotateY(-5deg) scale(.998); filter:brightness(.99)}
  48%  {transform:perspective(1600px) rotateY(-12deg) scale(.994); filter:brightness(.96)}
  62%  {transform:perspective(1600px) rotateY(-6deg) scale(.997); filter:brightness(.985)}
  100% {transform:perspective(1600px) rotateY(0deg) scale(1); filter:brightness(1)}
}
@keyframes osCurlFoldNext{
  0%{opacity:0;transform:translateX(100%) scaleX(.35)}
  18%{opacity:.58;transform:translateX(58%) scaleX(.58)}
  46%{opacity:.95;transform:translateX(2%) scaleX(1)}
  72%{opacity:.36;transform:translateX(-55%) scaleX(.7)}
  100%{opacity:0;transform:translateX(-120%) scaleX(.4)}
}
@keyframes osCurlShadowNext{
  0%{opacity:0;transform:translateX(60%) scaleX(.4)}
  38%{opacity:.7;transform:translateX(4%) scaleX(1)}
  76%{opacity:.22;transform:translateX(-70%) scaleX(.65)}
  100%{opacity:0;transform:translateX(-120%) scaleX(.4)}
}
@keyframes osCurlPrev{
  0%   {transform:perspective(1600px) rotateY(0deg) scale(1); filter:brightness(1)}
  22%  {transform:perspective(1600px) rotateY(5deg) scale(.998); filter:brightness(.99)}
  48%  {transform:perspective(1600px) rotateY(12deg) scale(.994); filter:brightness(.96)}
  62%  {transform:perspective(1600px) rotateY(6deg) scale(.997); filter:brightness(.985)}
  100% {transform:perspective(1600px) rotateY(0deg) scale(1); filter:brightness(1)}
}
@keyframes osCurlFoldPrev{
  0%{opacity:0;transform:translateX(-100%) scaleX(.35)}
  18%{opacity:.58;transform:translateX(-58%) scaleX(.58)}
  46%{opacity:.95;transform:translateX(-2%) scaleX(1)}
  72%{opacity:.36;transform:translateX(55%) scaleX(.7)}
  100%{opacity:0;transform:translateX(120%) scaleX(.4)}
}
@keyframes osCurlShadowPrev{
  0%{opacity:0;transform:translateX(-60%) scaleX(.4)}
  38%{opacity:.7;transform:translateX(-4%) scaleX(1)}
  76%{opacity:.22;transform:translateX(70%) scaleX(.65)}
  100%{opacity:0;transform:translateX(120%) scaleX(.4)}
}

/* Public sharing controls */
.os-photo-share{
  margin-top:10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding-top:9px;
  border-top:1px solid var(--line);
}
.os-photo-share__status{
  font-size:.76rem;
  color:var(--muted);
  font-weight:700;
}
.os-photo-share button{
  border:1px solid rgba(166,111,19,.36);
  background:transparent;
  color:#95630f;
  border-radius:999px;
  padding:6px 9px;
  font:inherit;
  font-size:.74rem;
  font-weight:700;
  cursor:pointer;
}
.os-photo-share button:hover,
.os-photo-share button:focus-visible{
  background:rgba(198,146,43,.10);
  border-color:rgba(166,111,19,.62);
  outline:none;
}
.os-photo-share.is-public .os-photo-share__status{color:#93620d}
.os-photo-share.is-public button{
  background:rgba(198,146,43,.13);
}

/* Public Gallery navigation prominence */
.os-public-gallery-link{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:6px;
}

/* --------------------------------------------------------------------------
   Top-corner lift before the gentle page turn
   -------------------------------------------------------------------------- */
.os-photo-viewer__page{
  overflow:visible;
}
.os-photo-viewer__page-inner{
  position:relative;
  width:100%;
  height:100%;
  overflow:hidden;
  border-radius:8px;
  background:#eee7d8;
  transform-style:preserve-3d;
}
.os-photo-viewer__page-corner{
  position:absolute;
  top:-1px;
  right:-1px;
  width:74px;
  height:74px;
  pointer-events:none;
  opacity:0;
  transform-origin:top right;
  clip-path:polygon(100% 0,100% 100%,0 0);
  background:
    linear-gradient(
      225deg,
      rgba(255,255,255,.95) 0%,
      rgba(250,240,213,.92) 34%,
      rgba(198,164,104,.55) 58%,
      rgba(76,51,22,.22) 76%,
      rgba(0,0,0,0) 100%
    );
  filter:drop-shadow(-7px 8px 6px rgba(34,23,10,.22));
  z-index:4;
}
.os-photo-viewer__page.turn-next .os-photo-viewer__page-corner{
  animation:osCornerLiftNext .30s cubic-bezier(.22,.7,.28,1) both;
}
.os-photo-viewer__page.turn-prev .os-photo-viewer__page-corner{
  left:-1px;
  right:auto;
  transform-origin:top left;
  clip-path:polygon(0 0,100% 0,0 100%);
  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.95) 0%,
      rgba(250,240,213,.92) 34%,
      rgba(198,164,104,.55) 58%,
      rgba(76,51,22,.22) 76%,
      rgba(0,0,0,0) 100%
    );
  filter:drop-shadow(7px 8px 6px rgba(34,23,10,.22));
  animation:osCornerLiftPrev .30s cubic-bezier(.22,.7,.28,1) both;
}

@keyframes osCornerLiftNext{
  0%{opacity:0;transform:rotate(0deg) scale(.25)}
  28%{opacity:.55;transform:rotate(-5deg) scale(.48)}
  62%{opacity:1;transform:rotate(-11deg) scale(.82)}
  100%{opacity:1;transform:rotate(-15deg) scale(1)}
}
@keyframes osCornerLiftPrev{
  0%{opacity:0;transform:rotate(0deg) scale(.25)}
  28%{opacity:.55;transform:rotate(5deg) scale(.48)}
  62%{opacity:1;transform:rotate(11deg) scale(.82)}
  100%{opacity:1;transform:rotate(15deg) scale(1)}
}

/* Delay the page body turn very slightly so the lifted corner leads the motion. */
.os-photo-viewer__page.turn-next{
  animation:osCurlNextCornerLead .86s cubic-bezier(.34,.02,.18,1) both;
}
.os-photo-viewer__page.turn-prev{
  animation:osCurlPrevCornerLead .86s cubic-bezier(.34,.02,.18,1) both;
}
.os-photo-viewer__page.turn-next::before{
  animation:osCurlFoldNextCornerLead .86s cubic-bezier(.34,.02,.18,1) both;
}
.os-photo-viewer__page.turn-next::after{
  animation:osCurlShadowNextCornerLead .86s cubic-bezier(.34,.02,.18,1) both;
}
.os-photo-viewer__page.turn-prev::before{
  animation:osCurlFoldPrevCornerLead .86s cubic-bezier(.34,.02,.18,1) both;
}
.os-photo-viewer__page.turn-prev::after{
  animation:osCurlShadowPrevCornerLead .86s cubic-bezier(.34,.02,.18,1) both;
}

@keyframes osCurlNextCornerLead{
  0%,18%{transform:perspective(1600px) rotateY(0deg) scale(1);filter:brightness(1)}
  32%{transform:perspective(1600px) rotateY(-3deg) scale(.999);filter:brightness(.995)}
  56%{transform:perspective(1600px) rotateY(-10deg) scale(.995);filter:brightness(.97)}
  72%{transform:perspective(1600px) rotateY(-5deg) scale(.998);filter:brightness(.988)}
  100%{transform:perspective(1600px) rotateY(0deg) scale(1);filter:brightness(1)}
}
@keyframes osCurlPrevCornerLead{
  0%,18%{transform:perspective(1600px) rotateY(0deg) scale(1);filter:brightness(1)}
  32%{transform:perspective(1600px) rotateY(3deg) scale(.999);filter:brightness(.995)}
  56%{transform:perspective(1600px) rotateY(10deg) scale(.995);filter:brightness(.97)}
  72%{transform:perspective(1600px) rotateY(5deg) scale(.998);filter:brightness(.988)}
  100%{transform:perspective(1600px) rotateY(0deg) scale(1);filter:brightness(1)}
}
@keyframes osCurlFoldNextCornerLead{
  0%,18%{opacity:0;transform:translateX(100%) scaleX(.35)}
  38%{opacity:.52;transform:translateX(62%) scaleX(.52)}
  58%{opacity:.94;transform:translateX(4%) scaleX(1)}
  78%{opacity:.34;transform:translateX(-55%) scaleX(.7)}
  100%{opacity:0;transform:translateX(-120%) scaleX(.4)}
}
@keyframes osCurlShadowNextCornerLead{
  0%,22%{opacity:0;transform:translateX(70%) scaleX(.35)}
  48%{opacity:.66;transform:translateX(5%) scaleX(1)}
  80%{opacity:.2;transform:translateX(-70%) scaleX(.65)}
  100%{opacity:0;transform:translateX(-120%) scaleX(.4)}
}
@keyframes osCurlFoldPrevCornerLead{
  0%,18%{opacity:0;transform:translateX(-100%) scaleX(.35)}
  38%{opacity:.52;transform:translateX(-62%) scaleX(.52)}
  58%{opacity:.94;transform:translateX(-4%) scaleX(1)}
  78%{opacity:.34;transform:translateX(55%) scaleX(.7)}
  100%{opacity:0;transform:translateX(120%) scaleX(.4)}
}
@keyframes osCurlShadowPrevCornerLead{
  0%,22%{opacity:0;transform:translateX(-70%) scaleX(.35)}
  48%{opacity:.66;transform:translateX(-5%) scaleX(1)}
  80%{opacity:.2;transform:translateX(70%) scaleX(.65)}
  100%{opacity:0;transform:translateX(120%) scaleX(.4)}
}

@media(prefers-reduced-motion:reduce){
  .os-photo-viewer__page-corner{display:none}
}

/* Our Story universal media centre */
.os-media-centre{margin-top:18px}
.os-media-toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 18px}
.os-media-toolbar .os-button{cursor:pointer}
.os-media-form[hidden]{display:none}
.os-media-form{margin:0 0 20px}
.os-media-form__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.os-media-form__wide{grid-column:1/-1}
.os-media-form label{display:grid;gap:6px;font-weight:700;font-size:.82rem}
.os-media-form input,.os-media-form textarea,.os-media-form select{
 width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:10px;
 padding:10px 11px;background:rgba(255,255,255,.52);font:inherit;color:inherit
}
.os-media-form textarea{resize:vertical;min-height:82px}
.os-media-form__checks{display:flex;gap:18px;flex-wrap:wrap;align-items:center}
.os-media-form__checks label{display:flex;grid-template-columns:auto 1fr;align-items:center;gap:7px;font-weight:600}
.os-media-form__checks input{width:auto}
.os-media-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.os-media-card{border:1px solid var(--line);border-radius:14px;padding:13px;background:rgba(255,255,255,.30);box-shadow:0 8px 20px rgba(78,55,22,.05)}
.os-media-card__preview{aspect-ratio:4/3;border-radius:10px;overflow:hidden;background:rgba(205,178,125,.12);display:grid;place-items:center;margin-bottom:10px}
.os-media-card__preview img,.os-media-card__preview video{width:100%;height:100%;object-fit:cover}
.os-media-card__preview audio{width:90%}
.os-media-card__type{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:var(--gold);font-weight:800}
.os-media-card h3{font-family:var(--serif);margin:5px 0 6px}
.os-media-card p{font-size:.84rem;color:var(--muted);line-height:1.5}
.os-media-card__meta{font-size:.76rem;color:var(--muted);display:grid;gap:3px}
.os-media-card__badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.os-media-card__badge{font-size:.68rem;border:1px solid var(--line);border-radius:999px;padding:4px 7px}
.os-media-empty{grid-column:1/-1;padding:24px;text-align:center;border:1px dashed rgba(166,111,19,.35);border-radius:14px;color:var(--muted)}
.os-count{font-size:.72rem;color:var(--muted);text-align:right}
@media(max-width:900px){.os-media-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.os-media-form__grid,.os-media-list{grid-template-columns:1fr}.os-media-form__wide{grid-column:auto}}

/* Home/Public Gallery navigation corrections */
html,body{min-width:0}
.os-shell{width:100%;min-width:0}
.os-main,.os-content,.os-hero__copy,.os-hero__visual{min-width:0}

@media(min-width:821px){
  .os-shell{
    display:grid!important;
    grid-template-columns:var(--sidebar-width,280px) minmax(0,1fr)!important;
  }
  .os-sidebar{position:sticky;top:0;height:100vh}
  .os-main{width:auto!important;max-width:none!important}
}
body[data-public-gallery="true"] .os-topbar{justify-content:space-between}

/* FAMILY LIFE LAYER */
.os-upcoming{display:grid;gap:10px}.os-event{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border:1px solid var(--line);border-radius:11px;background:var(--cream-2)}.os-event__date{font-family:var(--serif);color:#9b6812;font-weight:700;min-width:90px}.os-event__name{font-weight:700}.os-event__meta{font-size:.78rem;color:var(--muted)}
.os-profile-extra{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}.os-profile-extra label{display:grid;gap:6px;font-weight:700;font-size:.82rem}.os-profile-extra input,.os-profile-extra select{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:10px;padding:10px 11px;background:rgba(255,255,255,.52);font:inherit;color:inherit}
.os-join-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:16px}.os-join-step{padding:18px;border:1px solid var(--line);border-radius:13px;background:var(--cream-2)}.os-join-step__num{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:rgba(198,146,43,.13);color:#95630f;font-weight:800;margin-bottom:10px}
.os-season-control{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid rgba(198,146,43,.25);border-radius:999px;background:rgba(255,255,255,.025)}.os-season-control select{background:transparent;color:inherit;border:0;font:inherit}
[data-season="christmas"] .os-hero{position:relative}[data-season="christmas"] .os-hero::after{content:"";position:absolute;left:4%;right:4%;top:8px;height:6px;background:radial-gradient(circle,#d6aa4e 0 3px,transparent 4px) 0 0/42px 6px repeat-x;opacity:.7}
[data-season="newyear"] .os-hero{position:relative}[data-season="newyear"] .os-hero::after{content:"✦   ·   ✧   ·   ✦";position:absolute;right:6%;top:18px;color:#c8942e;letter-spacing:.45em;font-size:1.1rem;opacity:.72}
[data-season="easter"] .os-hero{position:relative}[data-season="easter"] .os-hero::after{content:"❀  ❁  ❀";position:absolute;right:5%;top:18px;color:#b6925c;letter-spacing:.35em;font-size:1.05rem;opacity:.58}
@media(max-width:850px){.os-join-steps,.os-profile-extra{grid-template-columns:1fr}}

/* SEASONAL HOME */
.os-season-greeting{display:none;position:absolute;z-index:5;left:7%;top:8%;max-width:43%;font-family:var(--serif);font-weight:500;line-height:.94}
html[data-season="christmas"] .os-season-greeting--christmas,html[data-season="newyear"] .os-season-greeting--newyear,html[data-season="easter"] .os-season-greeting--easter{display:block}
.os-season-greeting--christmas{color:#f1d090;font-size:clamp(2.2rem,4.5vw,4.5rem);text-shadow:0 2px 14px rgba(30,10,5,.75)}
.os-season-greeting--newyear{color:#e7bb60;font-size:clamp(2rem,4.2vw,4.2rem);text-shadow:0 2px 15px rgba(5,15,40,.8)}
.os-season-greeting--easter{color:#506642;font-size:clamp(2.2rem,4.3vw,4.3rem)}
html[data-season="christmas"] .os-hero__visual{background-image:linear-gradient(to right,var(--cream),transparent 16%),linear-gradient(to left,var(--cream),transparent 16%),linear-gradient(to bottom,var(--cream),transparent 12%),linear-gradient(to top,var(--cream),transparent 12%),url('../images/season-christmas.jpg')!important;background-size:cover!important;background-position:center!important}
html[data-season="newyear"] .os-hero__visual{background-image:linear-gradient(to right,var(--cream),transparent 16%),linear-gradient(to left,var(--cream),transparent 16%),linear-gradient(to bottom,var(--cream),transparent 12%),linear-gradient(to top,var(--cream),transparent 12%),url('../images/season-newyear.png')!important;background-size:cover!important;background-position:center!important}
html[data-season="easter"] .os-hero__visual{background-image:linear-gradient(to right,var(--cream),transparent 16%),linear-gradient(to left,var(--cream),transparent 16%),linear-gradient(to bottom,var(--cream),transparent 12%),linear-gradient(to top,var(--cream),transparent 12%),url('../images/season-easter.png')!important;background-size:cover!important;background-position:center!important}
html[data-season] .os-hero::after{content:none!important}
.os-event.is-milestone{border-color:rgba(198,146,43,.65);background:linear-gradient(135deg,rgba(198,146,43,.14),var(--cream-2));box-shadow:0 8px 22px rgba(120,78,10,.1)}
.os-milestone-badge{display:inline-flex;margin-left:7px;padding:3px 7px;border-radius:999px;background:rgba(198,146,43,.18);color:#8d5d0d;font-size:.68rem;font-weight:800}
.os-dob-fields{display:grid;grid-template-columns:.75fr 1.3fr 1fr;gap:10px}
@media(max-width:650px){.os-dob-fields{grid-template-columns:1fr}}

/* ==========================================================================
   SEASONAL POLISH v2.2
   ========================================================================== */

/* Normal family scene: move the source image a little lower in the frame
   so the top of the gold picture frame is not clipped. */
html[data-season="none"] .os-hero__visual,
html:not([data-season]) .os-hero__visual{
  background-position:center 42% !important;
}

/* Christmas: show more of the original Santa photograph, especially the
   raised glass. Use a slightly smaller image inside the same hero area. */
html[data-season="christmas"] .os-hero__visual{
  background-size:
    100% 100%,
    100% 100%,
    100% 100%,
    100% 100%,
    92% auto !important;
  background-position:
    center,
    center,
    center,
    center,
    center 44% !important;
  background-repeat:no-repeat !important;
}

/* Keep Merry Christmas live because the supplied Santa photograph has no
   permanent greeting baked into it. */
html[data-season="christmas"] .os-season-greeting--christmas{
  left:7%;
  top:10%;
  max-width:38%;
}

/* New Year: the approved artwork already contains Happy New Year wording.
   Prevent a second full greeting from appearing over it.  The live year
   remains available and is placed as a discreet replacement year panel. */
html[data-season="newyear"] .os-season-greeting--newyear{
  display:block;
  left:11%;
  top:46%;
  width:auto;
  max-width:none;
  padding:.06em .22em .10em;
  color:#e7bb60;
  font-size:clamp(2rem,4vw,3.9rem);
  line-height:1;
  background:linear-gradient(90deg,rgba(8,28,61,.94),rgba(8,28,61,.82));
  border-radius:.08em;
  box-shadow:0 5px 18px rgba(3,13,31,.22);
}
html[data-season="newyear"] .os-season-greeting--newyear > span:first-child{
  display:none;
}
html[data-season="newyear"] .os-season-greeting--newyear br{
  display:none;
}

/* Give the left greeting area a soft blue veil so the old baked year is
   subdued and the live current year reads cleanly. */
html[data-season="newyear"] .os-hero__visual::before{
  content:"";
  position:absolute;
  z-index:3;
  left:5%;
  top:7%;
  width:37%;
  height:61%;
  pointer-events:none;
  background:linear-gradient(
    90deg,
    rgba(7,27,61,.74) 0%,
    rgba(7,27,61,.48) 64%,
    rgba(7,27,61,0) 100%
  );
  border-radius:14px 0 0 14px;
}

/* Easter artwork already includes the approved Happy Easter lettering.
   Do not add a duplicate HTML greeting over the image. */
html[data-season="easter"] .os-season-greeting--easter{
  display:none !important;
}

/* Seasonal visual must be a positioning context for the New Year veil. */
html[data-season="newyear"] .os-hero__visual{
  position:relative;
}


/* Seasonal manual override is administrator-only.
   Automatic seasonal display continues for everyone. */
[data-season-admin-control][hidden]{display:none!important}
html:not([data-season-admin="true"]) [data-season-admin-control]{display:none!important}

/* ==========================================================================
   ADMIN AREA
   ========================================================================== */
.os-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.os-admin-card{border:1px solid var(--line);border-radius:14px;background:var(--cream-2);padding:20px;box-shadow:var(--shadow)}
.os-admin-card h2{font-family:var(--serif);margin:0 0 8px}.os-admin-card p{color:var(--muted);line-height:1.55}
.os-admin-season-buttons{display:flex;flex-wrap:wrap;gap:9px;margin-top:12px}
.os-admin-season-buttons button[aria-pressed="true"]{background:linear-gradient(180deg,#d9a843,#c48e24);color:#fff}
.os-admin-status{margin-top:10px;font-size:.85rem;color:var(--muted)}
.os-admin-lock{min-height:65vh;display:grid;place-items:center}.os-admin-lock__card{width:min(520px,100%);text-align:center}
@media(max-width:800px){.os-admin-grid{grid-template-columns:1fr}}

/* MEMBER-OWNED PROFILES / SUPPORT / DIGEST — v2.5 */
.os-member-edit-note{border-left:3px solid var(--gold);background:rgba(198,146,43,.07);padding:11px 13px;border-radius:0 9px 9px 0;color:var(--muted);font-size:.86rem;line-height:1.5}
.os-owner-only[hidden]{display:none!important}
.os-support-amounts{display:flex;gap:10px;flex-wrap:wrap;margin:15px 0}.os-support-amounts a{text-decoration:none;min-width:72px;text-align:center}
.os-support-heart{width:70px;height:70px;border-radius:50%;display:grid;place-items:center;margin:0 auto 12px;border:1px solid rgba(198,146,43,.35);background:rgba(198,146,43,.08);color:var(--gold);font-size:2rem}
.os-digest-options{display:grid;gap:12px}.os-digest-options label{display:flex;align-items:flex-start;gap:9px;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:var(--cream-2)}
.os-digest-options input{margin-top:3px}.os-setting-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--line)}.os-setting-row:last-child{border-bottom:0}.os-settings-status{font-size:.84rem;color:var(--muted)}
@media(max-width:700px){.os-setting-row{align-items:flex-start;flex-direction:column}}

/* ==========================================================================
   MESSAGE → CALENDAR EVENTS — v2.8
   ========================================================================== */
.os-event-option{margin:14px 0;padding:14px;border:1px solid var(--line);border-radius:12px;background:rgba(198,146,43,.055)}
.os-event-option__toggle{display:flex;gap:10px;align-items:flex-start;font-weight:700;cursor:pointer}
.os-event-option__toggle input{margin-top:4px}
.os-event-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.os-event-fields[hidden]{display:none!important}
.os-event-fields .os-field--wide{grid-column:1/-1}
.os-family-event{padding:15px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:110px 1fr auto;gap:15px;align-items:start}
.os-family-event:last-child{border-bottom:0}
.os-family-event__date{font-family:var(--serif);font-weight:700;color:var(--gold-dark);font-size:1.05rem}
.os-family-event__title{font-family:var(--serif);font-size:1.2rem;font-weight:700;margin-bottom:4px}
.os-family-event__meta{font-size:.88rem;color:var(--muted);line-height:1.45}
.os-family-event__actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.os-family-event__actions button,.os-family-event__actions a{font-size:.78rem;padding:7px 10px}
.os-message__event{margin-top:10px;padding:10px 12px;border-left:3px solid var(--gold);background:rgba(198,146,43,.07);border-radius:0 8px 8px 0;font-size:.88rem}
.os-message:target{outline:2px solid rgba(198,146,43,.45);outline-offset:5px;border-radius:8px}
.os-event-dialog{width:min(560px,calc(100% - 32px));border:1px solid var(--line);border-radius:16px;background:var(--cream);color:var(--ink);padding:22px;box-shadow:0 20px 70px rgba(0,0,0,.18)}
.os-event-dialog::backdrop{background:rgba(0,0,0,.35)}
.os-event-dialog__actions{display:flex;justify-content:flex-end;gap:10px;margin-top:15px}
@media(max-width:720px){
 .os-event-fields{grid-template-columns:1fr}
 .os-event-fields .os-field--wide{grid-column:auto}
 .os-family-event{grid-template-columns:1fr}
 .os-family-event__actions{justify-content:flex-start}
}

/* ==========================================================================
   HOUSEHOLD MEMBERS — v2.9
   ========================================================================== */
.os-household{margin-top:24px}
.os-household__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}
.os-household__head h2{margin:0;font-family:var(--serif)}
.os-household-list{display:grid;gap:12px}
.os-household-card{border:1px solid var(--line);border-radius:14px;background:var(--cream-2);padding:15px}
.os-household-card__top{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.os-household-card__name{font-family:var(--serif);font-size:1.15rem;font-weight:700}
.os-household-card__meta{font-size:.86rem;color:var(--muted);line-height:1.5;margin-top:4px}
.os-household-card__actions{display:flex;gap:7px;flex-wrap:wrap}
.os-household-card__actions button{font-size:.78rem;padding:7px 10px}
.os-household-empty{padding:16px;border:1px dashed rgba(198,146,43,.45);border-radius:12px;color:var(--muted);background:rgba(198,146,43,.04)}
.os-household-dialog{width:min(640px,calc(100% - 32px));border:1px solid var(--line);border-radius:16px;background:var(--cream);color:var(--ink);padding:22px;box-shadow:0 20px 70px rgba(0,0,0,.18)}
.os-household-dialog::backdrop{background:rgba(0,0,0,.35)}
.os-household-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.os-household-grid .os-field--wide{grid-column:1/-1}
.os-household-dialog__actions{display:flex;justify-content:flex-end;gap:10px;margin-top:15px}
@media(max-width:720px){
 .os-household__head{flex-direction:column}
 .os-household-grid{grid-template-columns:1fr}
 .os-household-grid .os-field--wide{grid-column:auto}
}

/* ==========================================================================
   PROFILE PHOTO SOFT EDGES — v2.10
   Applied automatically to every Family Room profile photograph.
   The original uploaded image remains unchanged; this is display-only.
   ========================================================================== */
.os-profile-photo-frame{
  --profile-edge-softness: 14%;
  --profile-halo-strength: .17;
  position:relative;
  width:min(100%,340px);
  aspect-ratio:1/1;
  margin:0 auto 14px;
  display:grid;
  place-items:center;
  overflow:visible;
}
.os-profile-photo-frame::before{
  content:"";
  position:absolute;
  inset:4%;
  border-radius:inherit;
  background:var(--profile-photo-background,rgba(198,146,43,.10));
  filter:blur(18px);
  opacity:var(--profile-halo-strength);
  z-index:0;
  pointer-events:none;
}
.os-profile-photo__image,
.os-profile-photo-frame img{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
  /* Feather the outer edge without changing the source image */
  -webkit-mask-image:radial-gradient(ellipse at center,#000 0%,#000 68%,rgba(0,0,0,.96) 76%,rgba(0,0,0,.62) 88%,transparent 100%);
  mask-image:radial-gradient(ellipse at center,#000 0%,#000 68%,rgba(0,0,0,.96) 76%,rgba(0,0,0,.62) 88%,transparent 100%);
}
.os-profile-photo--square{border-radius:18px}
.os-profile-photo--round{border-radius:50%}
.os-profile-photo--round .os-profile-photo__image,
.os-profile-photo--round img{border-radius:50%}
.os-profile-photo--square .os-profile-photo__image,
.os-profile-photo--square img{border-radius:18px}
.os-profile-photo-empty{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  border:1px dashed rgba(198,146,43,.45);
  background:linear-gradient(135deg,rgba(255,255,255,.55),rgba(198,146,43,.06));
  color:var(--gold-dark);
  font-size:3rem;
  -webkit-mask-image:radial-gradient(ellipse at center,#000 0%,#000 72%,rgba(0,0,0,.60) 90%,transparent 100%);
  mask-image:radial-gradient(ellipse at center,#000 0%,#000 72%,rgba(0,0,0,.60) 90%,transparent 100%);
}
.os-photo-shape-control{
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
}
.os-photo-shape-control__label{font-size:.82rem;font-weight:700;margin-right:3px}
.os-photo-shape-option{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 11px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--cream-2);
  cursor:pointer;
  font-size:.84rem;
}
.os-photo-shape-option:has(input:checked){
  border-color:rgba(198,146,43,.65);
  background:rgba(198,146,43,.10);
  color:var(--gold-dark);
}
.os-photo-effect-note{
  margin:9px auto 0;
  max-width:360px;
  text-align:center;
  font-size:.78rem;
  color:var(--muted);
}

/* ==========================================================================
   PROFILE PHOTO SOFT EDGES — v2.11
   Clearly visible soft feather plus a subtle warm halo.
   Display-only: the original uploaded photograph is never altered.
   ========================================================================== */
.os-profile-photo-frame{
  position:relative;
  width:min(100%,340px);
  aspect-ratio:1/1;
  margin:0 auto 18px;
  display:grid;
  place-items:center;
  overflow:visible;
  isolation:isolate;
}
.os-profile-photo-frame::before{
  content:"";
  position:absolute;
  inset:-14px;
  border-radius:28px;
  background:rgba(197,151,55,.18);
  filter:blur(18px);
  opacity:.85;
  z-index:-2;
  pointer-events:none;
}
.os-profile-photo-frame::after{
  content:"";
  position:absolute;
  inset:-7px;
  border-radius:24px;
  box-shadow:0 0 24px 12px rgba(197,151,55,.13);
  z-index:-1;
  pointer-events:none;
}
.os-profile-photo__image,
.os-profile-photo-frame img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
  /* A stronger feather begins before the outside edge so it is visibly soft. */
  -webkit-mask-image:radial-gradient(ellipse at center,
    #000 0%, #000 62%,
    rgba(0,0,0,.96) 69%,
    rgba(0,0,0,.80) 76%,
    rgba(0,0,0,.52) 84%,
    rgba(0,0,0,.24) 91%,
    transparent 99%);
  mask-image:radial-gradient(ellipse at center,
    #000 0%, #000 62%,
    rgba(0,0,0,.96) 69%,
    rgba(0,0,0,.80) 76%,
    rgba(0,0,0,.52) 84%,
    rgba(0,0,0,.24) 91%,
    transparent 99%);
}
.os-profile-photo--square{border-radius:22px}
.os-profile-photo--square::before,
.os-profile-photo--square::after{border-radius:30px}
.os-profile-photo--round{border-radius:50%}
.os-profile-photo--round::before,
.os-profile-photo--round::after,
.os-profile-photo--round .os-profile-photo__image,
.os-profile-photo--round img{border-radius:50%}
.os-profile-photo--square .os-profile-photo__image,
.os-profile-photo--square img{border-radius:22px}
.os-profile-photo-empty{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  border:1px dashed rgba(198,146,43,.45);
  background:linear-gradient(135deg,rgba(255,255,255,.55),rgba(198,146,43,.06));
  color:var(--gold-dark);
  font-size:3rem;
}
.os-photo-shape-control{
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
}
.os-photo-shape-control__label{font-size:.82rem;font-weight:700;margin-right:3px}
.os-photo-shape-option{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 11px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--cream-2);
  cursor:pointer;
  font-size:.84rem;
}
.os-photo-shape-option:has(input:checked){
  border-color:rgba(198,146,43,.65);
  background:rgba(198,146,43,.10);
  color:var(--gold-dark);
}
.os-photo-effect-note{
  margin:9px auto 0;
  max-width:360px;
  text-align:center;
  font-size:.78rem;
  color:var(--muted);
}

/* ==========================================================================
   BORDERLESS FEATHERED PROFILE PHOTOS — v2.12
   No frame, no border, no visible edge.
   Photo softly dissolves into the cream background with a restrained warm hue.
   Original uploaded image remains unchanged.
   ========================================================================== */

.os-profile-photo-frame{
  position:relative;
  width:min(100%,360px);
  aspect-ratio:1/1;
  margin:0 auto 18px;
  display:grid;
  place-items:center;
  overflow:visible;
  isolation:isolate;

  /* Explicitly remove any framing from older versions */
  border:none !important;
  outline:none !important;
  box-shadow:none !important;
  background:transparent !important;
}

/* Warm diffused hue behind the feathered image */
.os-profile-photo-frame::before{
  content:"";
  position:absolute;
  inset:3%;
  border-radius:inherit;
  background:
    radial-gradient(
      ellipse at center,
      rgba(212,170,76,.16) 0%,
      rgba(212,170,76,.12) 48%,
      rgba(212,170,76,.06) 70%,
      transparent 92%
    );
  filter:blur(22px);
  opacity:.72;
  z-index:-1;
  pointer-events:none;
}

/* No second frame, halo ring or outside line */
.os-profile-photo-frame::after{
  display:none !important;
  content:none !important;
}

/* The photograph itself fades naturally into the page */
.os-profile-photo__image,
.os-profile-photo-frame img{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;

  border:none !important;
  outline:none !important;
  box-shadow:none !important;
  background:transparent !important;

  /* Strong enough to be visible, but still soft and natural */
  -webkit-mask-image:
    radial-gradient(
      ellipse at center,
      #000 0%,
      #000 60%,
      rgba(0,0,0,.98) 66%,
      rgba(0,0,0,.90) 72%,
      rgba(0,0,0,.72) 79%,
      rgba(0,0,0,.48) 86%,
      rgba(0,0,0,.24) 92%,
      rgba(0,0,0,.08) 96%,
      transparent 100%
    );
  mask-image:
    radial-gradient(
      ellipse at center,
      #000 0%,
      #000 60%,
      rgba(0,0,0,.98) 66%,
      rgba(0,0,0,.90) 72%,
      rgba(0,0,0,.72) 79%,
      rgba(0,0,0,.48) 86%,
      rgba(0,0,0,.24) 92%,
      rgba(0,0,0,.08) 96%,
      transparent 100%
    );
}

/* Square remains the default, but without a visible rounded border */
.os-profile-photo--square{
  border-radius:0 !important;
}
.os-profile-photo--square .os-profile-photo__image,
.os-profile-photo--square img{
  border-radius:0 !important;
}

/* Round remains available as an optional display choice */
.os-profile-photo--round{
  border-radius:50%;
}
.os-profile-photo--round::before{
  border-radius:50%;
}
.os-profile-photo--round .os-profile-photo__image,
.os-profile-photo--round img{
  border-radius:50%;
}

/* Empty upload state: no decorative frame */
.os-profile-photo-empty{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  border:none !important;
  outline:none !important;
  box-shadow:none !important;
  background:
    radial-gradient(
      ellipse at center,
      rgba(198,146,43,.09) 0%,
      rgba(198,146,43,.045) 58%,
      transparent 95%
    );
  color:var(--gold-dark);
  font-size:3rem;
  -webkit-mask-image:
    radial-gradient(
      ellipse at center,
      #000 0%,
      #000 62%,
      rgba(0,0,0,.68) 82%,
      rgba(0,0,0,.18) 94%,
      transparent 100%
    );
  mask-image:
    radial-gradient(
      ellipse at center,
      #000 0%,
      #000 62%,
      rgba(0,0,0,.68) 82%,
      rgba(0,0,0,.18) 94%,
      transparent 100%
    );
}

.os-photo-shape-control{
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
}
.os-photo-shape-control__label{
  font-size:.82rem;
  font-weight:700;
  margin-right:3px;
}
.os-photo-shape-option{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 11px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--cream-2);
  cursor:pointer;
  font-size:.84rem;
}
.os-photo-shape-option:has(input:checked){
  border-color:rgba(198,146,43,.65);
  background:rgba(198,146,43,.10);
  color:var(--gold-dark);
}
.os-photo-effect-note{
  margin:9px auto 0;
  max-width:380px;
  text-align:center;
  font-size:.78rem;
  color:var(--muted);
}

/* ==========================================================================
   TRUE BORDERLESS FEATHERED PROFILE PHOTOS — v2.13
   Browser-robust implementation:
   - absolutely no border/frame/outline
   - square default, round optional
   - cream/gold overlay visibly feathers ALL FOUR image edges into the page
   - warm diffusion behind image
   ========================================================================== */

.os-profile-photo-frame{
  position:relative;
  width:min(100%,360px);
  aspect-ratio:1/1;
  margin:0 auto 18px;
  display:block;
  overflow:visible;
  isolation:isolate;

  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}

/* Soft warm diffusion behind the picture — never a ring or border. */
.os-profile-photo-frame::before{
  content:"";
  position:absolute;
  inset:-18px;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(
      ellipse at center,
      rgba(201,155,54,.15) 0%,
      rgba(201,155,54,.10) 45%,
      rgba(201,155,54,.045) 68%,
      transparent 88%
    );
  filter:blur(18px);
  opacity:.72;
}

/*
   This overlay sits ON TOP of the photograph and paints the page colour
   progressively over the outer edge. This avoids relying on CSS masking,
   so the feather remains visible in normal desktop browsers.
*/
.os-profile-photo-frame::after{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:3;
  pointer-events:none;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:
    radial-gradient(
      ellipse at center,
      rgba(250,247,239,0) 0%,
      rgba(250,247,239,0) 55%,
      rgba(250,247,239,.04) 62%,
      rgba(250,247,239,.12) 68%,
      rgba(250,247,239,.28) 74%,
      rgba(250,247,239,.48) 81%,
      rgba(250,247,239,.70) 87%,
      rgba(250,247,239,.88) 93%,
      rgba(250,247,239,.98) 98%,
      rgb(250,247,239) 100%
    );
}

/* The picture itself has no visible edge styling whatsoever. */
.os-profile-photo__image,
.os-profile-photo-frame img{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;

  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
  border-radius:0 !important;

  /* Remove older mask rules entirely; v2.13 uses the overlay above. */
  -webkit-mask-image:none !important;
  mask-image:none !important;
}

/* Square is the default. */
.os-profile-photo--square,
.os-profile-photo--square::before,
.os-profile-photo--square::after,
.os-profile-photo--square .os-profile-photo__image,
.os-profile-photo--square img{
  border-radius:0 !important;
}

/* Round remains an optional member choice. */
.os-profile-photo--round{
  border-radius:50% !important;
}
.os-profile-photo--round::before,
.os-profile-photo--round::after,
.os-profile-photo--round .os-profile-photo__image,
.os-profile-photo--round img{
  border-radius:50% !important;
}

/* Empty state also remains borderless. */
.os-profile-photo-empty{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:
    radial-gradient(
      ellipse at center,
      rgba(198,146,43,.075) 0%,
      rgba(198,146,43,.035) 58%,
      transparent 90%
    ) !important;
  color:var(--gold-dark);
  font-size:3rem;
}

.os-photo-shape-control{
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
}
.os-photo-shape-control__label{
  font-size:.82rem;
  font-weight:700;
  margin-right:3px;
}
.os-photo-shape-option{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 11px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--cream-2);
  cursor:pointer;
  font-size:.84rem;
}
.os-photo-shape-option:has(input:checked){
  border-color:rgba(198,146,43,.65);
  background:rgba(198,146,43,.10);
  color:var(--gold-dark);
}
.os-photo-effect-note{
  margin:9px auto 0;
  max-width:390px;
  text-align:center;
  font-size:.78rem;
  color:var(--muted);
}

/* ==========================================================================
   FOUR-EDGE FEATHERED PROFILE PHOTOS — v2.14
   Forced visible fade on all 4 sides using cream overlays.
   No border, frame, outline, rounded box or visible rectangular edge.
   ========================================================================== */

.os-profile-photo-frame{
  position:relative;
  width:min(100%,360px);
  aspect-ratio:1/1;
  margin:0 auto 18px;
  overflow:visible;
  isolation:isolate;

  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}

/* Gentle warm diffusion behind the photo */
.os-profile-photo-frame::before{
  content:"";
  position:absolute;
  inset:-22px;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(
      ellipse at center,
      rgba(198,146,43,.14) 0%,
      rgba(198,146,43,.08) 50%,
      rgba(198,146,43,.03) 72%,
      transparent 90%
    );
  filter:blur(20px);
  opacity:.78;
}

/*
  Four independent edge fades. The exact panel colour (var(--cream-2))
  is painted over the outside of the photograph and becomes transparent
  toward the centre. This produces a genuine feather on every side.
*/
.os-profile-photo-frame::after{
  content:"";
  position:absolute;
  inset:-2px;
  z-index:4;
  pointer-events:none;

  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;

  background:
    linear-gradient(to right,
      var(--cream-2) 0%,
      rgba(255,253,248,.96) 4%,
      rgba(255,253,248,.78) 9%,
      rgba(255,253,248,.48) 15%,
      rgba(255,253,248,.20) 21%,
      transparent 29%),
    linear-gradient(to left,
      var(--cream-2) 0%,
      rgba(255,253,248,.96) 4%,
      rgba(255,253,248,.78) 9%,
      rgba(255,253,248,.48) 15%,
      rgba(255,253,248,.20) 21%,
      transparent 29%),
    linear-gradient(to bottom,
      var(--cream-2) 0%,
      rgba(255,253,248,.96) 4%,
      rgba(255,253,248,.78) 9%,
      rgba(255,253,248,.48) 15%,
      rgba(255,253,248,.20) 21%,
      transparent 29%),
    linear-gradient(to top,
      var(--cream-2) 0%,
      rgba(255,253,248,.96) 4%,
      rgba(255,253,248,.78) 9%,
      rgba(255,253,248,.48) 15%,
      rgba(255,253,248,.20) 21%,
      transparent 29%);
}

/* Photo itself: completely plain, with no framing of any kind */
.os-profile-photo__image,
.os-profile-photo-frame img{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;

  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
  border-radius:0 !important;

  -webkit-mask-image:none !important;
  mask-image:none !important;
}

/* Square is the default */
.os-profile-photo--square,
.os-profile-photo--square::before,
.os-profile-photo--square::after,
.os-profile-photo--square .os-profile-photo__image,
.os-profile-photo--square img{
  border-radius:0 !important;
}

/* Round remains optional */
.os-profile-photo--round{
  border-radius:50% !important;
}
.os-profile-photo--round::before,
.os-profile-photo--round::after,
.os-profile-photo--round .os-profile-photo__image,
.os-profile-photo--round img{
  border-radius:50% !important;
}

/* Borderless empty state */
.os-profile-photo-empty{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:
    radial-gradient(
      ellipse at center,
      rgba(198,146,43,.065) 0%,
      rgba(198,146,43,.03) 55%,
      transparent 88%
    ) !important;
  color:var(--gold-dark);
  font-size:3rem;
}

.os-photo-shape-control{
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
}
.os-photo-shape-control__label{
  font-size:.82rem;
  font-weight:700;
  margin-right:3px;
}
.os-photo-shape-option{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 11px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--cream-2);
  cursor:pointer;
  font-size:.84rem;
}
.os-photo-shape-option:has(input:checked){
  border-color:rgba(198,146,43,.65);
  background:rgba(198,146,43,.10);
  color:var(--gold-dark);
}
.os-photo-effect-note{
  margin:9px auto 0;
  max-width:390px;
  text-align:center;
  font-size:.78rem;
  color:var(--muted);
}

/* ==========================================================================
   GUARANTEED BORDERLESS PROFILE FEATHER — v2.15
   Self-contained: no dependency on theme variables for the fade itself.
   ========================================================================== */

.os-profile-photo-frame{
  position:relative;
  width:min(100%,360px);
  aspect-ratio:1/1;
  margin:0 auto 18px;
  display:block;
  overflow:visible;
  isolation:isolate;

  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}

/* Warm cream/gold diffusion behind the photo. */
.os-profile-photo-frame::before{
  content:"";
  position:absolute;
  inset:-20px;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(
    ellipse at center,
    rgba(201,157,62,.17) 0%,
    rgba(201,157,62,.11) 42%,
    rgba(201,157,62,.055) 66%,
    rgba(201,157,62,0) 88%
  );
  filter:blur(22px);
  opacity:.78;
}

/*
  Guaranteed visible feather:
  a soft cream overlay is painted directly over the outside 28% of the image
  from each edge.  Hard-coded cream tones prevent browser failure if a CSS
  theme variable is unavailable.
*/
.os-profile-photo-frame::after{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:5;
  pointer-events:none;

  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;

  background:
    linear-gradient(to right,
      #fbf8f0 0%,
      rgba(251,248,240,.98) 3%,
      rgba(251,248,240,.90) 7%,
      rgba(251,248,240,.74) 12%,
      rgba(251,248,240,.52) 17%,
      rgba(251,248,240,.30) 22%,
      rgba(251,248,240,.12) 26%,
      rgba(251,248,240,0) 31%),
    linear-gradient(to left,
      #fbf8f0 0%,
      rgba(251,248,240,.98) 3%,
      rgba(251,248,240,.90) 7%,
      rgba(251,248,240,.74) 12%,
      rgba(251,248,240,.52) 17%,
      rgba(251,248,240,.30) 22%,
      rgba(251,248,240,.12) 26%,
      rgba(251,248,240,0) 31%),
    linear-gradient(to bottom,
      #fbf8f0 0%,
      rgba(251,248,240,.98) 3%,
      rgba(251,248,240,.90) 7%,
      rgba(251,248,240,.74) 12%,
      rgba(251,248,240,.52) 17%,
      rgba(251,248,240,.30) 22%,
      rgba(251,248,240,.12) 26%,
      rgba(251,248,240,0) 31%),
    linear-gradient(to top,
      #fbf8f0 0%,
      rgba(251,248,240,.98) 3%,
      rgba(251,248,240,.90) 7%,
      rgba(251,248,240,.74) 12%,
      rgba(251,248,240,.52) 17%,
      rgba(251,248,240,.30) 22%,
      rgba(251,248,240,.12) 26%,
      rgba(251,248,240,0) 31%);
}

/* The actual uploaded image is completely unframed. */
.os-profile-photo__image,
.os-profile-photo-frame img{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;

  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
  border-radius:0 !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
}

/* Square is the default and has no visible geometric edge. */
.os-profile-photo--square,
.os-profile-photo--square::before,
.os-profile-photo--square::after,
.os-profile-photo--square .os-profile-photo__image,
.os-profile-photo--square img{
  border-radius:0 !important;
}

/* Round remains optional. */
.os-profile-photo--round{
  border-radius:50% !important;
}
.os-profile-photo--round::before,
.os-profile-photo--round::after,
.os-profile-photo--round .os-profile-photo__image,
.os-profile-photo--round img{
  border-radius:50% !important;
}

/* Borderless empty state before a member uploads a photograph. */
.os-profile-photo-empty{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:radial-gradient(
    ellipse at center,
    rgba(201,157,62,.075) 0%,
    rgba(201,157,62,.032) 58%,
    rgba(201,157,62,0) 90%
  ) !important;
  color:#a87919;
  font-size:3rem;
}

.os-photo-shape-control{
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
}
.os-photo-shape-control__label{
  font-size:.82rem;
  font-weight:700;
  margin-right:3px;
}
.os-photo-shape-option{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 11px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--cream-2);
  cursor:pointer;
  font-size:.84rem;
}
.os-photo-shape-option:has(input:checked){
  border-color:rgba(198,146,43,.65);
  background:rgba(198,146,43,.10);
  color:var(--gold-dark);
}
.os-photo-effect-note{
  margin:9px auto 0;
  max-width:390px;
  text-align:center;
  font-size:.78rem;
  color:var(--muted);
}

/* ==========================================================================
   RENDERED FEATHERED PROFILE PHOTOS — v2.16
   The profile display asset itself contains transparency at the outer edges.
   This reliably reproduces the approved feathered look in normal browsers.
   The original uploaded image remains unchanged.
   ========================================================================== */

.os-profile-photo-frame{
  position:relative;
  width:min(100%,390px);
  aspect-ratio:1/1;
  margin:0 auto 18px;
  display:grid;
  place-items:center;
  overflow:visible;

  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}

.os-profile-photo-frame::before,
.os-profile-photo-frame::after{
  display:none !important;
  content:none !important;
}

.os-profile-photo__image,
.os-profile-photo-frame img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  object-position:center;

  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
  border-radius:0 !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
}

/* Square is default.  The display PNG itself is feathered, so there is no geometric edge. */
.os-profile-photo--square,
.os-profile-photo--square img,
.os-profile-photo--square .os-profile-photo__image{
  border-radius:0 !important;
}

/* Round remains optional.  Future uploaded display derivatives can be rendered round when selected. */
.os-profile-photo--round,
.os-profile-photo--round img,
.os-profile-photo--round .os-profile-photo__image{
  border-radius:50% !important;
}

.os-profile-photo-empty{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:radial-gradient(
    ellipse at center,
    rgba(201,157,62,.07) 0%,
    rgba(201,157,62,.025) 58%,
    transparent 90%
  ) !important;
  color:#a87919;
  font-size:3rem;
}

.os-photo-shape-control{
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
}
.os-photo-shape-control__label{font-size:.82rem;font-weight:700;margin-right:3px}
.os-photo-shape-option{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 11px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--cream-2);
  cursor:pointer;
  font-size:.84rem;
}
.os-photo-shape-option:has(input:checked){
  border-color:rgba(198,146,43,.65);
  background:rgba(198,146,43,.10);
  color:var(--gold-dark);
}
.os-photo-effect-note{
  margin:9px auto 0;
  max-width:390px;
  text-align:center;
  font-size:.78rem;
  color:var(--muted);
}


/* ==========================================================================
   FINAL PROFILE PHOTO TREATMENT — v2.17
   ========================================================================== */
.os-profile-photo-frame{
  width:min(100%,390px);
  aspect-ratio:1/1;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
  overflow:visible !important;
}
.os-profile-photo-frame::before,
.os-profile-photo-frame::after{
  content:none !important;
  display:none !important;
}
.os-profile-photo__image,
.os-profile-photo-frame img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
}
/* The rendered square derivative carries the 20px-equivalent rounded feather itself. */
.os-profile-photo--square,
.os-profile-photo--square .os-profile-photo__image,
.os-profile-photo--square img{
  border-radius:20px !important;
}
/* Round remains optional and uses its own feathered derivative when available. */
.os-profile-photo--round,
.os-profile-photo--round .os-profile-photo__image,
.os-profile-photo--round img{
  border-radius:50% !important;
}


/* ==========================================================================
   FAMILY ROOM CARD PROFILE PHOTOGRAPHS — v2.18
   One member profile photograph, reused consistently on the Rooms page.
   ========================================================================== */
.room-card-profile{
  width:112px;
  height:112px;
  margin:14px auto 16px;
  display:grid;
  place-items:center;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:radial-gradient(circle, rgba(205,165,76,.14) 0%, rgba(248,243,231,.08) 58%, transparent 76%);
  overflow:visible;
}
.room-card-profile__image{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}
.room-card-profile--placeholder{
  border-radius:20px;
  background:radial-gradient(circle, rgba(205,165,76,.16), rgba(248,243,231,.62) 62%, transparent 78%);
}
.room-card-profile__initials{
  font-family:Georgia, "Times New Roman", serif;
  font-size:1.7rem;
  color:#a77b20;
  opacity:.72;
}
@media (max-width:700px){
  .room-card-profile{width:96px;height:96px;margin:12px auto 14px;}
}

/* V2.19 LOCAL HOUSEHOLD DIALOG FIX */
.os-household-dialog[open]{display:block;}


/* ==========================================================================
   V2.21 — UNIFORM CONTENT BLOCKS
   ========================================================================== */
.os-grid > .os-card{
  display:flex;
  flex-direction:column;
  height:100%;
}
.os-grid > .os-card > .os-card__link,
.os-grid > .os-card > a.os-card__link{
  margin-top:auto;
}
.os-grid--3 > .os-card{min-height:250px}
.os-grid--4 > .os-card{min-height:335px}
.os-home-shortcuts > .os-card{min-height:238px}
.os-card h2{margin-bottom:10px}
.os-card p{margin-top:0}
.os-room-action-card{cursor:pointer;text-decoration:none;color:inherit}
.os-room-action-card:focus-visible{outline:3px solid rgba(198,146,43,.45);outline-offset:3px}

.os-room-content-section{scroll-margin-top:24px}
.os-room-content-form{display:grid;gap:13px}
.os-room-content-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.os-room-content-grid .os-field--wide{grid-column:1/-1}
.os-room-content-list{display:grid;gap:12px;margin-top:18px}
.os-room-content-item{border:1px solid var(--line);border-radius:14px;padding:15px;background:rgba(255,255,255,.34)}
.os-room-content-item h3{font-family:var(--serif);margin:0 0 5px}
.os-room-content-item__meta{font-size:.84rem;color:var(--muted);margin-bottom:7px}

.os-album-card-photo{
  width:112px;height:112px;margin:12px auto 16px;display:grid;place-items:center;
  border:0;outline:0;background:radial-gradient(circle,rgba(205,165,76,.15),rgba(248,243,231,.52) 62%,transparent 80%);
}
.os-album-card-photo img{width:100%;height:100%;object-fit:contain;border:0;outline:0;box-shadow:none;background:transparent}
.os-album-card-photo__placeholder{font-family:var(--serif);font-size:1.65rem;color:#a77b20;opacity:.68}

.os-timeline-empty{padding:18px;border:1px dashed rgba(198,146,43,.36);border-radius:12px;color:var(--muted)}
@media(max-width:720px){
  .os-room-content-grid{grid-template-columns:1fr}
  .os-room-content-grid .os-field--wide{grid-column:auto}
}


/* ==========================================================================
   V2.22 — HOME SHORTCUT CARD ALIGNMENT
   Keep all six Home cards visually aligned without altering their design.
   ========================================================================== */
.os-home-shortcut-card{
  display:grid !important;
  grid-template-rows:
    34px      /* icon */
    58px      /* heading */
    minmax(92px, 1fr) /* body copy */
    1px       /* divider */
    50px;     /* action link */
  align-items:start;
  height:100%;
  min-height:238px;
}

.os-home-shortcut-card .os-card__icon{
  align-self:start;
  margin:0 0 8px;
}

.os-home-shortcut-card h2{
  margin:0;
  align-self:start;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  text-align:center;
  line-height:1.05;
}

.os-home-shortcut-card p{
  margin:0;
  align-self:start;
  text-align:center;
}

.os-home-shortcut-card::after{
  content:"";
  display:block;
  width:100%;
  height:1px;
  background:var(--line);
  align-self:end;
}

/* Existing link sits in the final fixed row on every card */
.os-home-shortcut-card .os-card__link,
.os-home-shortcut-card > a:not(.os-card){
  margin:0 !important;
  align-self:center;
  justify-self:center;
  text-align:center;
}

/* Do not draw a second divider if the card already has one via another rule */
.os-home-shortcut-card .os-card__link{
  border-top:0 !important;
  padding-top:0 !important;
}

@media(max-width:900px){
  .os-home-shortcut-card{
    grid-template-rows:34px auto auto 1px 46px;
    min-height:220px;
  }
}

/* Household birthdays & anniversaries — calendar spacing */
[data-household-dates] .os-upcoming__item{
  display:grid;
  grid-template-columns:110px 1fr;
  column-gap:20px;
  align-items:baseline;
}

[data-household-dates] .os-upcoming__item strong{
  white-space:nowrap;
}

/* CONSOLIDATED REFINEMENTS — 27 AUG 2026 */
.os-collapse-heading{cursor:pointer;position:relative;padding-right:34px}.os-collapse-heading::after{content:'⌄';position:absolute;right:5px;top:0;color:var(--gold);font-size:1.2em;transition:transform .18s ease}.os-collapse-heading[aria-expanded="true"]::after{transform:rotate(180deg)}.os-collapse-body[hidden]{display:none!important}
.os-vault-item{cursor:default}.os-support-heart{font-size:2.4rem;color:var(--gold)}
html[data-season="christmas"] .os-hero__visual{background-size:cover!important;background-position:center center!important}
html[data-season="christmas"] .os-season-greeting--christmas{left:5%;top:8%;max-width:34%;font-size:clamp(1.8rem,3.5vw,3.5rem)}
html[data-season="newyear"] .os-hero__visual{background-size:cover!important;background-position:center!important}
html[data-season="newyear"] .os-hero__visual::before{content:none!important}
html[data-season="newyear"] .os-season-greeting--newyear{left:5%;top:8%;background:rgba(8,28,61,.38);padding:.16em .28em;font-size:clamp(1.8rem,3.4vw,3.5rem)}
html[data-season="newyear"] .os-season-greeting--newyear>span:first-child{display:inline!important}html[data-season="newyear"] .os-season-greeting--newyear br{display:block!important}
html[data-season="easter"] .os-hero__visual{background-size:cover!important;background-position:center!important}
html[data-season="easter"] .os-season-greeting--easter{display:block!important;left:5%;top:8%;font-size:clamp(1.8rem,3.4vw,3.5rem);text-shadow:0 1px 8px rgba(255,255,255,.8)}
@media(max-width:700px){html[data-season] .os-season-greeting{font-size:1.65rem;max-width:46%}.os-public-actions{flex-wrap:wrap}}
.os-admin-about-stack{display:grid;grid-template-columns:1fr;gap:18px}.os-admin-about-stack>div{border:1px solid var(--line);border-radius:12px;padding:16px;background:rgba(255,255,255,.28)}.os-admin-about-stack textarea{min-height:100px}
/* Album presentation: media remains one shared collection; photographs receive a softer album-card treatment. */
body[data-album-owner] .os-media-list{gap:18px}body[data-album-owner] .os-media-card{border-radius:16px;box-shadow:0 10px 28px rgba(83,61,26,.10)}body[data-album-owner] .os-media-card img{border-radius:12px}