/* v27: material, not palette. Original fills, gradients, photographs and ink
   stay in their existing stylesheets. Only neutral light and fine grain are
   layered behind content. Real backdrop blur is reserved for floating UI. */
:root{
 --matte-light:radial-gradient(ellipse 32% 38% at 29% 34%,#ffffff66,transparent 100%),radial-gradient(ellipse 28% 32% at 72% 66%,#00000008,transparent 100%),linear-gradient(125deg,#ffffff12,transparent 46%,#ffffff08);
}

/* Flow surfaces have no moving scene behind them: softly diffused light and
   grain provide depth without large, expensive full-page backdrop filters. */
body[data-view=home] :is(.family-section,.cinema-discover,.cinema-moments,.cinema-close),
body:not([data-view=home]) #main,
.store-footer,
.policy-copy,
.contact-layout>.contact-form,
.checkout-page .checkout-boundary,
.about-everyday,.contact-story,.help-close,.info-box,.product-page .product-help,
.catalog-page .collection-help-card,
.catalog-page .collection-card[data-stage=studio] .collection-card-body{
 position:relative;
 isolation:isolate;
}
body[data-view=home] :is(.family-section,.cinema-discover,.cinema-moments,.cinema-close)::before,
body:not([data-view=home]) #main::before,
.store-footer::before,
.policy-copy::before,
.contact-layout>.contact-form::before,
.checkout-page .checkout-boundary::before,
.about-everyday::before,.contact-story::before,.help-close::before,.info-box::before,
.product-page .product-help::before,
.catalog-page .collection-help-card::before,
.catalog-page .collection-card[data-stage=studio] .collection-card-body::before{
 content:'';
 position:absolute;
 inset:0;
 z-index:-1;
 pointer-events:none;
 border-radius:inherit;
 background-image:url('assets/matte-grain-v27.svg'),var(--matte-light);
}
.cart-page .cart-summary{background-image:url('assets/matte-grain-v27.svg'),var(--matte-light)}
.panel[data-kind=catalog-filters] .catalog-drawer-actions{background-image:url('assets/matte-grain-v27.svg'),linear-gradient(#ffffff18,transparent)}

/* The needs popover must still paint above the following photo section. */
body[data-view=home] .cinema-discover{z-index:2}

/* Subtle light on the inside edge; no extra card frame or changed spacing. */
.policy-copy,
.contact-layout>.contact-form,
.checkout-page .checkout-boundary,
.cart-page .cart-summary{
 box-shadow:inset 0 1px 0 #ffffff70,inset 0 -1px 0 #00000004;
}

/* Floating sheets use exactly the current cream RGB, with translucency.
   Text, controls and images are never blurred. Approved menu/header stay intact. */
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 .panel:not([data-kind=menu]),
 .panel[data-kind=catalog-filters]{
  background-color:rgba(255,248,231,.86);
  background-image:url('assets/matte-grain-v27.svg');
  -webkit-backdrop-filter:blur(24px);
  backdrop-filter:blur(24px);
  box-shadow:inset 0 1px 0 #ffffff70,0 18px 48px #261a1518;
 }
 .panel:not([data-kind=menu])::backdrop{
  -webkit-backdrop-filter:blur(3px);
  backdrop-filter:blur(3px);
 }
 .cinema-filter-body,
 .sticky-buy{
  background-color:rgba(255,248,231,.9);
  background-image:url('assets/matte-grain-v27.svg');
  -webkit-backdrop-filter:blur(18px);
  backdrop-filter:blur(18px);
 }
}

@media(prefers-reduced-transparency:reduce){
 body[data-view=home] :is(.family-section,.cinema-discover,.cinema-moments,.cinema-close)::before,
 body:not([data-view=home]) #main::before,
 .store-footer::before,
 .policy-copy::before,
 .contact-layout>.contact-form::before,
 .checkout-page .checkout-boundary::before,
 .about-everyday::before,.contact-story::before,.help-close::before,.info-box::before,
 .product-page .product-help::before,
 .catalog-page .collection-help-card::before,
 .catalog-page .collection-card[data-stage=studio] .collection-card-body::before{display:none}
 .cart-page .cart-summary,
 .panel[data-kind=catalog-filters] .catalog-drawer-actions{background-image:none}
 .panel:not([data-kind=menu]),.panel[data-kind=catalog-filters],.cinema-filter-body,.sticky-buy{
  background:#fff8e7;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
 }
 .panel:not([data-kind=menu])::backdrop{-webkit-backdrop-filter:none;backdrop-filter:none}
}

/* Visible only in authenticated draft previews. */
.admin-preview-indicator{position:fixed;inset-inline:12px;bottom:12px;z-index:1000;padding:12px 18px;border:1px solid #d7baa1;border-radius:12px;background:#fff8e7ed;backdrop-filter:blur(14px);box-shadow:0 5px 25px #261a1526;font:12px Heebo,Arial,sans-serif;color:#261a15;text-align:center;pointer-events:none}.admin-preview-indicator a{margin-inline-start:15px;text-decoration:underline;font-weight:600;pointer-events:auto}
