/* iPhone-first interaction and safe-area refinements. No private content caching. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:20px}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
a,button{touch-action:manipulation}
input,select,textarea{max-width:100%;box-sizing:border-box}
.calendar-full-event h1,.calendar-event-body,.private-family-body,.private-note-body{overflow-wrap:anywhere}
@media(max-width:767px){
 body{font-size:16px;min-width:0}
 .site-header{padding-top:calc(18px + env(safe-area-inset-top,0px));padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));gap:12px}
 .brand{min-width:0;gap:10px;font-size:21px;letter-spacing:-.8px}
 .brand-caption{font-size:8px;letter-spacing:.5px;line-height:1.5;max-width:190px}
 .brand-icon{flex-shrink:0}
 .header-right{flex-shrink:0;gap:5px}
 .header-right .text-button{min-height:44px;min-width:44px;white-space:nowrap;padding:10px 3px;font-size:12px}
 .family-nav{display:flex;flex-wrap:nowrap;gap:8px;overflow-x:auto;max-width:100%;padding:8px max(16px,env(safe-area-inset-left,0px)) 13px;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scroll-padding-inline:16px}
 .family-nav>a{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:44px;padding:10px 13px;white-space:nowrap;border:1px solid var(--line);border-radius:24px;background:var(--paper);font-size:12px;line-height:1.4}
 main{min-width:0}
 .boards-page,.family-home,.privacy-page{padding-left:max(18px,env(safe-area-inset-left,0px));padding-right:max(18px,env(safe-area-inset-right,0px))}
 .page-heading{align-items:stretch;gap:20px}
 .page-heading .action-link{justify-content:space-between;min-height:48px;margin-top:0;align-self:stretch}
 h1{overflow-wrap:anywhere}
 button,input,select,textarea{font-size:16px}
 input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select{min-height:48px;min-width:0}
 input[type=date],input[type=time],input[type=month]{display:block;min-width:0;width:100%;text-align:left}
 textarea{min-height:140px;min-width:0;line-height:1.6}
 input[type=checkbox],input[type=radio]{min-width:22px;min-height:22px;accent-color:var(--green)}
 .primary,.secondary-button,.share-actions>button,.share-actions>a{min-height:48px;justify-content:space-between;font-size:14px}
 .admin-link,.back-link,.person-actions>a,.post-controls>a,.calendar-bottom-bar>a,.calendar-view-note>a,.calendar-detail-link{display:inline-flex;align-items:center;min-height:44px;line-height:1.45}
 .form-actions,.share-actions,.person-actions{gap:12px}
 .calendar-view-form>div,.calendar-form-dates>div{min-width:0}
 .calendar-month-navigation>a{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
 .calendar-view-form{align-items:stretch}
 .login-card{min-width:0}
 .login-form input{font-size:16px;min-height:48px}
 .google-sign-in,.login-card .primary{min-height:48px;font-size:15px}
 .login-link-box input,.plex-email-box input{font-size:16px;min-width:0;width:100%}
 .person-identity{min-width:0}
 .person-identity p,.person-identity h2,.field-note,.copy-feedback{overflow-wrap:anywhere}
 footer{padding-left:max(18px,env(safe-area-inset-left,0px));padding-right:max(18px,env(safe-area-inset-right,0px));padding-bottom:calc(25px + env(safe-area-inset-bottom,0px));gap:20px}
 footer>a{min-height:44px;display:inline-flex;align-items:center}
}
@media(max-width:430px){
 .private-pill{display:none}
 .site-header{align-items:center}
 .calendar-form-dates{grid-template-columns:1fr}
 .calendar-view-form{flex-wrap:wrap}
 .calendar-view-form>div{flex:1 1 130px}
 .calendar-view-form>button{width:100%}
 .form-actions>button,.share-actions>button,.share-actions>a{width:100%}
 .login-card{padding:25px 22px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* Real wedding photographs remain in the authenticated private data mount. */
.family-background{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:var(--cream)}
.family-background-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:12px;position:absolute;inset:-30px;transform:rotate(-3deg) scale(1.05)}
.family-background-grid img{width:100%;height:100%;min-height:0;object-fit:cover;filter:saturate(.7);opacity:.64}
.family-background::after{content:"";position:absolute;inset:0;background:rgba(247,245,237,.57)}
.has-family-background{isolation:isolate}
.has-family-background .site-header,.has-family-background .family-nav,.has-family-background footer{background:rgba(247,245,237,.94)}
.has-family-background main{background:rgba(255,254,250,.95);border:1px solid rgba(220,224,212,.9);border-radius:20px;padding-top:38px;padding-bottom:38px;box-shadow:0 12px 45px rgba(38,61,53,.06)}
@media(max-width:767px){
 .family-background-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:8px;inset:-12px}
 .has-family-background main{margin-left:10px;margin-right:10px;border-radius:16px;padding-top:27px;padding-bottom:27px}
 .has-family-background .family-home,.has-family-background .boards-page,.has-family-background .privacy-page{padding-left:20px;padding-right:20px}
 .calendar-event-form input[type=date],.calendar-event-form input[type=time],.calendar-event-form select,.calendar-view-form input,.calendar-view-form select,.private-family-form select{font-size:16px}
}
@media(min-width:768px){.family-background-grid picture:last-child:nth-child(5){grid-column:span 2}}

.family-background-grid picture{display:block;min-width:0;min-height:0}
@media(max-width:767px){.family-background-grid{grid-template-rows:repeat(2,minmax(0,1fr))}.family-background-grid picture{grid-column:1/-1}.family-background-grid picture:nth-child(n+3){display:none}}
@media(max-width:767px){
 .calendar-view-form .secondary-button{min-height:48px;font-size:16px}
 .album-choice-control select{min-height:48px;font-size:16px}
 .calendar-checkbox-row label{min-height:44px}
}
