/*
 * Lagoon Experience visual foundation v1 — original design archive, 14 Oct 2026.
 * Distinct morning/day/evening; no generated mockup screenshots as background.
 * Clean atmospheric resort photography is not yet available; the slot stays empty.
 */
:root{
 --lagoon-ivory:#fff8ed;--lagoon-stone:#e5d5bf;--lagoon-blue:#94bcc0;
 --lagoon-sand:#dfc2a0;--lagoon-gold:#bc8c51;--lagoon-navy:#0c1d32;
 --lagoon-amber:#e5b777;--surface-radius:22px;
 --surface-shadow:0 12px 27px rgba(46,32,21,.17);
 --photo-gradient:linear-gradient(0deg,rgba(14,17,19,.85) 0%,rgba(14,17,19,.22) 48%,transparent 78%);
 --glass-bg:rgba(255,250,240,.82);--glass-edge:rgba(204,179,138,.4);
 --glass-shadow:0 8px 25px rgba(48,38,28,.09);
 --environment-photo:none;--environment-light:radial-gradient(ellipse 90% 60% at 50% 0%,rgba(224,242,236,.5),transparent 90%);
}
body[data-period="morning"]{
 --appbg:radial-gradient(ellipse 72% 34% at 8% 0%,rgba(170,218,223,.68),transparent 94%),linear-gradient(165deg,#f4faf5 0%,#f5efdf 48%,#fff9ef 100%);
 --paper:#fff9f0;--ink:#223c47;--sub:#536e73;--accent:#a9804a;--outline:#e6d8c3;
 --glass-bg:rgba(255,251,242,.82);--glass-edge:rgba(197,179,144,.45);
 --environment-light:radial-gradient(ellipse 78% 75% at 50% 0%,rgba(255,255,246,.55),transparent 87%);
}
body[data-period="midday"]{
 --appbg:radial-gradient(ellipse 85% 32% at 88% 0%,rgba(255,239,197,.73),transparent 94%),linear-gradient(164deg,#f1f1e8 0%,#f5e9d9 44%,#fff8eb 100%);
 --paper:#fffaef;--ink:#2a3d41;--sub:#697471;--accent:#b9894a;--outline:#e5d6c0;
 --glass-bg:rgba(255,250,239,.84);--glass-edge:rgba(195,158,111,.42);
 --environment-light:radial-gradient(ellipse 82% 80% at 50% 0%,rgba(255,239,201,.5),transparent 87%);
}
body[data-period="evening"]{
 --appbg:radial-gradient(ellipse 90% 30% at 87% 0%,rgba(184,115,58,.21),transparent 93%),radial-gradient(ellipse 110% 80% at 0% 12%,#183a4c 0%,transparent 63%),linear-gradient(166deg,#0b2638 0%,#0e1c34 56%,#0e1427 100%);
 --paper:#162c3f;--ink:#f8edda;--sub:#c3c7cb;--accent:#e6b677;--accent-ink:#38281a;--outline:rgba(232,190,130,.28);
 --glass-bg:rgba(18,38,54,.78);--glass-edge:rgba(230,187,126,.37);
 --glass-shadow:0 10px 33px rgba(2,11,27,.29);--surface-shadow:0 13px 33px rgba(0,6,16,.38);
 --photo-gradient:linear-gradient(0deg,rgba(6,11,19,.89) 0%,rgba(8,14,22,.34) 45%,transparent 78%);
 --environment-light:radial-gradient(ellipse 78% 85% at 50% 0%,rgba(230,169,99,.14),transparent 86%);
}
body[data-period="evening"]{background:#091629}
body[data-period="morning"],body[data-period="midday"]{background:#e9e0d3}
.app-shell{background-image:var(--environment-photo),var(--appbg);background-size:cover;background-repeat:no-repeat;background-position:center top}
.masthead{position:relative;isolation:isolate;min-height:117px;display:flex;align-items:center;justify-content:center;padding:calc(9px + env(safe-area-inset-top)) 20px 10px}
.masthead::before{content:"";position:absolute;inset:0;background:var(--environment-light);pointer-events:none;z-index:-1}
.brand-lockup{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0}
.masthead .crest{width:94px;height:56px;margin:0 auto -5px;object-fit:contain}
.masthead .brand{font-family:var(--serif);font-size:23px;line-height:1.25;letter-spacing:-.8px;white-space:nowrap}
.context-glass{position:absolute;z-index:2;top:calc(13px + env(safe-area-inset-top));right:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:78px;padding:7px 9px;border-radius:15px;border:1px solid var(--glass-edge);background:var(--glass-bg);box-shadow:var(--glass-shadow);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:var(--ink)}
.context-clock{font-size:11px;line-height:1.2;font-weight:650;font-variant-numeric:tabular-nums}
.context-region{font-size:9px;line-height:1.2;color:var(--sub);letter-spacing:.2px}
body[data-period="evening"] .masthead .crest{mix-blend-mode:screen;filter:sepia(.55) saturate(1.1)}
/* Compact gallery masthead retains both identity and a right-side context glass. */
.gallery-shell .gallery-masthead{min-height:67px;max-height:78px;display:flex;flex-direction:row;align-items:center;justify-content:center;padding:calc(5px + env(safe-area-inset-top)) 12px 6px}
.gallery-shell .gallery-masthead .crest{width:53px;height:24px;margin:0 auto -1px}
.gallery-shell .gallery-masthead .brand{font-size:17px;line-height:1.15;letter-spacing:-.4px}
.gallery-shell .gallery-masthead .context-glass{top:calc(8px + env(safe-area-inset-top));right:9px;min-width:66px;padding:5px 7px;border-radius:12px}
.gallery-shell .gallery-masthead .context-clock{font-size:10px}
.gallery-shell .gallery-masthead .context-region{font-size:8px}
/* Shared daylight softness and luminous evening glass information surfaces. */
.venue-control,.filter:not(.selected),.search-bar,.detail-expansion,.update-panel{background:var(--glass-bg);border-color:var(--glass-edge);box-shadow:var(--glass-shadow);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.filter.selected{background:linear-gradient(130deg,#d6a668,var(--accent));border-color:transparent;color:#342719;font-weight:650}
body[data-period="evening"] .filter.selected{color:#2d251c}
.taste-tile,.tile,.detail-photo,.now-photo,.explore-photo{border-radius:var(--surface-radius);box-shadow:var(--surface-shadow);isolation:isolate}
.taste-shade,.tile-shade,.detail-grad{background:var(--photo-gradient)}
.taste-label,.tile-text{filter:drop-shadow(0 2px 8px rgba(0,0,0,.28))}
.taste-label small,.tile-text small{color:#fff9ed}
.taste-tile{border:1px solid rgba(255,246,224,.23)}
.gallery-shell .gallery-status,.tile .mark-icon,.tile .flag-food,.detail-photo .mark-icon,.detail-photo .flag-food{background:rgba(12,29,37,.30);border:1px solid rgba(255,245,218,.3);border-radius:50%;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
.gallery-shell .gallery-status{width:34px;height:34px}
.gallery-shell .gallery-status.flag-food{color:#e3f4d2}
.tile .heart-btn{border-radius:50%;background:rgba(15,29,34,.17);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
/* Scenic hero surfaces, shared for later work; no layout changes to Now/Explore. */
.now-photo,.explore-photo{background-color:#244153}
.now-photo::before,.explore-photo::before{background:linear-gradient(0deg,rgba(7,13,22,.83),rgba(7,13,22,.06) 85%)}
@media(min-width:950px) and (orientation:landscape){
 .main-nav{background:var(--glass-bg);border-right:1px solid var(--glass-edge);box-shadow:var(--glass-shadow);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
 .app-shell{box-shadow:0 18px 58px rgba(22,21,23,.14)}
}
@media(max-width:360px){
 .masthead .crest{width:81px;height:51px}
 .masthead .brand{font-size:20px}
 .context-glass{right:9px;min-width:66px;padding:6px 7px}
 .gallery-shell .gallery-masthead .brand{font-size:15px}
 .gallery-shell .gallery-masthead .context-glass{min-width:58px;padding:5px}
}
@media(prefers-reduced-transparency:reduce){
 .context-glass,.venue-control,.filter:not(.selected),.search-bar,.detail-expansion,.update-panel{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--paper)}
}