/* Nileleen / glass, light and motion. 25 October 2026. */
.header{background:#fffbf7;border-bottom:1px solid #32102b20;box-shadow:0 6px 28px #32102b09,inset 0 1px #fff}
.header-actions .edit-button{padding:7px 10px;border:1px solid #32102b20;border-radius:30px;background:#ffffff65;box-shadow:inset 0 1px #fff9}
.mobile-nav{background:#fffbf7;border:1px solid #32102b20;border-top:0;border-radius:0 0 18px 18px;box-shadow:0 20px 40px #32102b15}
.mobile-nav a{border-bottom:1px solid #32102b14}
.mobile-nav a:last-child{border:0}
#edit-dialog{width:min(470px,100%);max-width:100%;background:#fffbf7;border-inline-start:1px solid #ffffffbb;border-start-start-radius:22px;border-end-start-radius:22px;box-shadow:-12px 0 70px #32102b24,inset 1px 0 #fff}
#edit-dialog::backdrop{background:#32102b55;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
#edit-dialog .drawer-heading{padding-bottom:22px;border-bottom:1px solid #32102b20}
#edit-dialog .drawer-description{color:#58434f}
#edit-dialog .saved-item{background:#ffffff5c;border:1px solid #ffffffaa;padding:15px;border-radius:14px;margin-bottom:12px;box-shadow:0 3px 14px #32102b06}
#edit-dialog .saved-thumb{border-radius:7px;overflow:hidden}
#edit-dialog .close-inline{display:grid;place-items:center;width:36px;height:36px;border:1px solid #32102b20;border-radius:50%;background:#ffffff75;flex-shrink:0}
#edit-dialog .drawer-actions .button{border-radius:8px}
@supports((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 .header{background:linear-gradient(110deg,#fffbf7de,#ffffffc9 55%,#fff4f9d9);backdrop-filter:blur(20px) saturate(135%);-webkit-backdrop-filter:blur(20px) saturate(135%)}
 .mobile-nav{background:linear-gradient(135deg,#fffbf7f2,#fff5faf0);backdrop-filter:blur(22px) saturate(130%);-webkit-backdrop-filter:blur(22px) saturate(130%)}
 #edit-dialog{background:linear-gradient(140deg,#fff7faf2,#fffbf7e8 45%,#f5f4fff0);backdrop-filter:blur(26px) saturate(125%);-webkit-backdrop-filter:blur(26px) saturate(125%)}
}
:is(.campaign-copy .text-link,.teen-feature .text-link,.edit-invite .button,.drawer-actions .button){position:relative;isolation:isolate;overflow:hidden}
:is(.campaign-copy .text-link,.teen-feature .text-link,.edit-invite .button,.drawer-actions .button)::before{content:"";position:absolute;inset:-20% -35%;z-index:-1;pointer-events:none;background:linear-gradient(110deg,transparent 35%,#edbd5940 44%,#fff5d8a6 50%,#edbd5940 56%,transparent 65%);transform:translateX(-110%)}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 :is(.campaign-copy .text-link,.teen-feature .text-link,.edit-invite .button,.drawer-actions .button):not(:disabled):hover::before{animation:nileleen-gold-pass .72s ease-out both}
}
@keyframes nileleen-gold-pass{from{transform:translateX(-110%)}to{transform:translateX(110%)}}
/* Content starts visible. Only the observer adds waiting states off screen. */
.photo-reveal{transition:opacity .6s ease,translate .6s cubic-bezier(.2,.65,.3,1)}
.photo-reveal.reveal-waiting{opacity:0;translate:0 16px}
.photo-reveal:focus-within{opacity:1;translate:none}
@media(max-width:760px){
 .header{backdrop-filter:blur(14px) saturate(125%);-webkit-backdrop-filter:blur(14px) saturate(125%)}
 .header-actions .edit-button{padding:5px 7px;gap:4px}
 #edit-dialog{padding:28px 23px;border-start-start-radius:18px;border-end-start-radius:18px}
 #edit-dialog .drawer-heading h2{font-size:35px}
 #edit-dialog .saved-item{grid-template-columns:70px 1fr;gap:14px;padding:12px}
}
@media(max-width:370px){.header .brand-lockup{width:155px}.header-actions{gap:7px}.header-actions .edit-button{padding:4px 6px}}
@media(prefers-reduced-motion:reduce){
 .photo-reveal,.photo-reveal.reveal-waiting{opacity:1!important;translate:none!important;transition:none!important}
 :is(.campaign-copy .text-link,.teen-feature .text-link,.edit-invite .button,.drawer-actions .button)::before{display:none;animation:none!important}
}
@media print{.photo-reveal,.photo-reveal.reveal-waiting{opacity:1!important;translate:none!important;transition:none!important}}
@media(prefers-reduced-transparency:reduce){.header,.mobile-nav,#edit-dialog{background:#fffbf7;backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(forced-colors:active){
 .header,.mobile-nav,#edit-dialog,#edit-dialog .saved-item{background:Canvas;border:1px solid CanvasText;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
 .photo-reveal,.photo-reveal.reveal-waiting{opacity:1;translate:none;transition:none}
 :is(.campaign-copy .text-link,.teen-feature .text-link,.edit-invite .button,.drawer-actions .button)::before{display:none}
}
