/* Signature Nails | Welcome-derived 3D crystal glass.
 * Final visual layer for public salon, guest, owner, staff, customer routes.
 * Approved Welcome artwork and controls are deliberately excluded.
 * Shared materials; no business logic or layout rewrites. */
body:not(.welcome-mode){
 --sn-crystal-ink:#512639;
 --sn-crystal-rim:rgba(250,208,183,.84);
 --sn-crystal-blur:blur(17px) saturate(140%);
 --sn-crystal-blur-small:blur(10px) saturate(125%);
 --sn-crystal-shell:
   linear-gradient(120deg,rgba(255,255,255,.80),rgba(255,255,255,.17) 28%,transparent 51%),
   radial-gradient(ellipse at 96% 0%,rgba(255,229,228,.60),transparent 55%),
   linear-gradient(147deg,rgba(255,253,249,.86),rgba(255,237,232,.73) 55%,rgba(247,208,207,.78));
 --sn-crystal-card:
   linear-gradient(115deg,rgba(255,255,255,.78),rgba(255,255,255,.14) 33%,transparent 59%),
   radial-gradient(ellipse at 94% 3%,rgba(255,240,223,.66),transparent 52%),
   linear-gradient(151deg,rgba(255,253,249,.88),rgba(255,238,234,.74) 54%,rgba(244,207,208,.83));
 --sn-crystal-dense:
   linear-gradient(125deg,rgba(255,255,255,.74),transparent 48%),
   linear-gradient(150deg,rgba(255,254,250,.99),rgba(255,243,238,.96));
 --sn-crystal-shadow:
   inset 0 2px 1px rgba(255,255,255,.96),
   inset 1px 0 0 rgba(255,255,255,.63),
   inset 0 -4px 9px rgba(147,83,88,.13),
   0 3px 0 rgba(165,99,87,.19),
   0 17px 40px rgba(93,31,58,.20),
   0 30px 65px rgba(99,41,57,.10);
 --sn-crystal-card-shadow:
   inset 0 2px 1px rgba(255,255,255,.97),
   inset 1px 0 0 rgba(255,255,255,.56),
   inset 0 -3px 8px rgba(159,82,94,.11),
   0 3px 0 rgba(171,108,94,.18),
   0 10px 24px rgba(91,35,61,.15),
   0 23px 42px rgba(91,35,61,.09);
}
/* Structural glass: multiple highlights, a tinted core, refractive blur,
   bevelled edge and independently layered shadows. Marble art stays behind. */
body:not(.welcome-mode) :is(
 #site-shell .site-header,#site-shell .site-footer,
 #site-shell .hero,#site-shell .hero-art,#site-shell .hero-art-inner,
 #signature-app-navigation,.overlay.open .dialog,#overlay.app-screen .dialog
){
 background-color:rgba(255,246,242,.86)!important;
 background-image:var(--sn-crystal-shell)!important;
 border:1.5px solid var(--sn-crystal-rim)!important;
 box-shadow:var(--sn-crystal-shadow)!important;
 -webkit-backdrop-filter:var(--sn-crystal-blur);
 backdrop-filter:var(--sn-crystal-blur);
 color:var(--sn-crystal-ink);
}
body:not(.welcome-mode) #site-shell .site-header{
 border-left:0!important;border-right:0!important;border-top:0!important;
 box-shadow:inset 0 2px rgba(255,255,255,.96),inset 0 -2px rgba(164,100,91,.15),0 12px 34px rgba(102,42,68,.14)!important;
}
body:not(.welcome-mode) #site-shell .site-footer{
 border-left:0!important;border-right:0!important;border-bottom:0!important;
 box-shadow:inset 0 2px 1px rgba(255,255,255,.88),0 -8px 28px rgba(100,43,67,.09)!important;
}
body:not(.welcome-mode) #site-shell .site-footer :is(p,strong){
 color:var(--sn-crystal-ink)!important;
}
body:not(.welcome-mode) #site-shell .hero{
 border-radius:clamp(22px,3vw,38px);
 margin-top:clamp(16px,3vw,32px);
}
body:not(.welcome-mode) #site-shell .hero-art{
 overflow:hidden;border-radius:clamp(22px,3vw,36px)!important;
}
body:not(.welcome-mode) #site-shell .hero-art-inner{
 border-radius:140px 140px 27px 27px;
 background-image:var(--sn-crystal-card)!important;
 box-shadow:var(--sn-crystal-card-shadow)!important;
 -webkit-backdrop-filter:var(--sn-crystal-blur-small);
 backdrop-filter:var(--sn-crystal-blur-small);
}
body:not(.welcome-mode) #signature-app-navigation{
 border-radius:clamp(18px,2.5vw,26px)!important;
 background-image:var(--sn-crystal-shell)!important;
 box-shadow:var(--sn-crystal-shadow)!important;
}
body:not(.welcome-mode) #signature-app-navigation .signature-nav-identity{
 border-radius:16px;
 background-image:radial-gradient(ellipse at center,rgba(255,252,247,.80),transparent 71%)!important;
}
body:not(.welcome-mode) #signature-app-navigation .signature-nav-tabs{
 border-top-color:rgba(163,95,91,.40)!important;
}
/* The full-screen role-aware dialog is a translucent architectural plane.
   Preserves the approved floral crop, nav structure, scroll and close button. */
body:not(.welcome-mode) .overlay.open .dialog,
body:not(.welcome-mode) #overlay.app-screen .dialog{
 border-radius:clamp(16px,2.4vw,30px)!important;
 background-image:
  linear-gradient(125deg,rgba(255,255,255,.73),rgba(255,255,255,.15) 28%,transparent 51%),
  radial-gradient(ellipse at 100% 11%,rgba(255,225,220,.46),transparent 49%),
  linear-gradient(147deg,rgba(255,252,247,.87),rgba(255,231,231,.78) 55%,rgba(249,220,210,.84))!important;
}
body:not(.welcome-mode) .overlay.open .dialog::before{
 background:linear-gradient(90deg,#ffe5c6,#ad5477 49%,#f6c9a0)!important;
 box-shadow:0 1px 0 rgba(255,255,255,.93),0 3px 8px rgba(118,35,69,.24)!important;
}
/* Shared crystal cards for customer/employee/owner workflows and public salon.
   Dense widgets are deliberately handled separately for legibility. */
body:not(.welcome-mode) :is(
 #site-shell .service-tile,#site-shell .owner-shortcut,
 .overlay.open .dialog .ui-card,
 .overlay.open .dialog .ui-stat,
 .overlay.open .dialog .ops-section,
 .overlay.open .dialog .ops-request,
 .overlay.open .dialog .ops-appointment,
 .overlay.open .dialog .actionable-record,
 .overlay.open .dialog .actionable-detail,
 .overlay.open .dialog .actionable-change,
 .overlay.open .dialog .actionable-info,
 .overlay.open .dialog .signature-shortcut,
 .overlay.open .dialog .signature-customer-grid article,
 .overlay.open .dialog .readiness-item,
 .overlay.open .dialog .demo-check-item,
 .overlay.open .dialog .sn-collection,
 .overlay.open .dialog .sn-unassigned-services,
 .overlay.open .dialog .booking-summary,
 .overlay.open .dialog .booking-price,
 .overlay.open .dialog .ui-modal-section,
 .overlay.open .dialog .booking-pane
){
 background-color:rgba(255,250,246,.86)!important;
 background-image:var(--sn-crystal-card)!important;
 border:1px solid rgba(198,139,112,.70)!important;
 box-shadow:var(--sn-crystal-card-shadow)!important;
 -webkit-backdrop-filter:var(--sn-crystal-blur-small);
 backdrop-filter:var(--sn-crystal-blur-small);
 color:var(--sn-crystal-ink);
}
/* Business tables, calendars and records need near-opaque glass.
   Never recolor statuses, chips, event states or approval indicators. */
body:not(.welcome-mode) .overlay.open .dialog :is(
 .ui-row,.actionable-row,.ops-action-panel,.ops-appointment-open,
 .actionable-data,.sn-collection-service,.calendar-day,.calendar-cell,
 .calendar-lane,.calendar-time,.calendar-day-head,.item,.note,.demo-safety
){
 background-color:rgba(255,251,247,.97)!important;
 background-image:var(--sn-crystal-dense)!important;
 border-color:rgba(191,133,106,.64)!important;
 box-shadow:inset 0 1px rgba(255,255,255,.95),0 4px 11px rgba(95,47,63,.08)!important;
 color:var(--sn-crystal-ink);
}
body:not(.welcome-mode) .overlay.open .dialog :is(.ui-error,.ui-success,.ui-chip,.calendar-block,.calendar-entry){
 background-image:none!important;
}
body:not(.welcome-mode) .overlay.open .dialog :is(table,th,td){
 color:var(--sn-crystal-ink);
}
body:not(.welcome-mode) .overlay.open .dialog th{
 background-color:rgba(255,247,241,.98);
}
body:not(.welcome-mode) .overlay.open .dialog :is(
 input:not([type=checkbox]):not([type=radio]),textarea,select
){
 background:linear-gradient(180deg,rgba(255,255,255,.99),rgba(255,249,244,.97))!important;
 border-color:rgba(178,110,92,.72)!important;
 box-shadow:inset 0 2px 6px rgba(108,46,59,.10),0 1px rgba(255,255,255,.96)!important;
 color:#482033!important;
}
body:not(.welcome-mode) .overlay.open .dialog :is(input,textarea,select):focus-visible{
 outline:3px solid #88254b!important;
 outline-offset:2px!important;
}
/* Raised, illuminated controls: retain primary wine gradient and semantics. */
body:not(.welcome-mode) :is(
 #site-shell .site-button,#site-shell .site-nav button,
 #signature-app-navigation button,
 .overlay.open .dialog button.primary,
 .overlay.open .dialog button.back,.overlay.open .dialog .site-button
){
 border-color:rgba(196,137,109,.90)!important;
 box-shadow:inset 0 2px 2px rgba(255,255,255,.79),
  inset 0 -3px 4px rgba(109,37,59,.12),0 2px 0 rgba(155,91,77,.36),
  0 7px 17px rgba(88,27,55,.20)!important;
}
body:not(.welcome-mode) :is(
 #site-shell .primary-action,#site-shell .nav-accent,
 #signature-app-navigation .signature-nav-tabs button.active,
 #signature-app-navigation .signature-nav-tabs button[aria-current="page"],
 .overlay.open .dialog button.primary
){
 background-image:linear-gradient(115deg,rgba(255,255,255,.23),transparent 41%,rgba(26,0,12,.12)),var(--sn-material-button-primary)!important;
 color:#fffafa!important;
 text-shadow:0 1px 2px rgba(47,2,23,.75)!important;
 box-shadow:inset 0 2px 2px rgba(255,247,239,.29),
  inset 0 -4px 6px rgba(51,3,22,.47),0 3px 0 rgba(105,49,51,.8),
  0 9px 19px rgba(88,27,55,.29)!important;
}
body:not(.welcome-mode) :is(
 #site-shell button,#signature-app-navigation button,
 .overlay.open .dialog button,.overlay.open .dialog a,
 .overlay.open .dialog input,.overlay.open .dialog select
):focus-visible{
 outline:3px solid #812047!important;outline-offset:3px!important;
}
body:not(.welcome-mode) #site-shell .service-tile,
body:not(.welcome-mode) .overlay.open .dialog :is(.signature-shortcut,.actionable-record,.sn-collection){
 transition:box-shadow .24s ease,transform .24s ease,border-color .24s ease;
}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
 body:not(.welcome-mode) #site-shell .service-tile:hover,
 body:not(.welcome-mode) .overlay.open .dialog :is(.signature-shortcut,.actionable-record,.sn-collection):hover{
  transform:translateY(-2px);
  box-shadow:inset 0 2px 1px rgba(255,255,255,.98),0 4px 0 rgba(173,110,92,.22),0 16px 34px rgba(93,31,58,.21)!important;
 }
}
/* Mobile: smaller blur budgets and no additional outer horizontal space. */
@media(max-width:600px){
 body:not(.welcome-mode){
  --sn-crystal-blur:blur(9px) saturate(120%);
  --sn-crystal-blur-small:blur(5px) saturate(112%);
 }
 body:not(.welcome-mode) #site-shell .hero{
  margin-inline:10px;border-radius:22px;
 }
 body:not(.welcome-mode) .overlay.open .dialog{
  border-left:0!important;border-right:0!important;border-radius:0!important;
  box-shadow:inset 0 2px 1px rgba(255,255,255,.97)!important;
 }
 body:not(.welcome-mode) #signature-app-navigation{
  box-shadow:inset 0 2px rgba(255,255,255,.97),0 10px 23px rgba(98,41,66,.15)!important;
 }
}
/* Accessibility and browser fallback: opacity before spectacle. */
@media(prefers-reduced-transparency:reduce), (prefers-contrast:more){
 body:not(.welcome-mode){
  --sn-crystal-shell:linear-gradient(145deg,#fffdf9,#f5e7e0);
  --sn-crystal-card:linear-gradient(145deg,#fffdf9,#f9ede8);
  --sn-crystal-dense:linear-gradient(145deg,#fffefa,#fff8f3);
  --sn-crystal-blur:none;--sn-crystal-blur-small:none;
 }
}
@media(prefers-reduced-motion:reduce){
 body:not(.welcome-mode) #site-shell .service-tile,
 body:not(.welcome-mode) .overlay.open .dialog :is(.signature-shortcut,.actionable-record,.sn-collection){
  transition:none!important;transform:none!important;
 }
}
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
 body:not(.welcome-mode){
  --sn-crystal-shell:linear-gradient(145deg,#fffdf8,#f8e5dd);
  --sn-crystal-card:linear-gradient(145deg,#fffdf9,#f9eae3);
  --sn-crystal-dense:linear-gradient(145deg,#fffefa,#fff8f3);
 }
}
