/* moments.css - Moments: photo upload screens and memory wall */
/* ===== MOMENTS (photo sharing) ===== */
#tk{background:linear-gradient(135deg,#0b2f6d,#153f92);padding:12px;border-radius:18px;border:1px solid var(--gold);box-shadow:0 10px 26px #0b2f6d55;margin-top:10px}
#tk:before{content:"E-RESERVATION SLIP · KEEP THIS HANDY";display:block;text-align:center;color:#f5d37a;font-size:9px;letter-spacing:2px;margin-bottom:8px}#tkw{margin:0}
.mm{position:fixed;top:0;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;z-index:30;background:linear-gradient(180deg,#e6edf9,#f7f9fd);overflow:auto;display:none}.mm.open{display:block}
.mh{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:10px;background:linear-gradient(135deg,#0b2f6d,#153f92);color:#fff;padding:12px 14px;border-bottom:3px solid var(--o)}
.mh button{background:#ffffff22;border:0;color:#fff;border-radius:50%;width:34px;height:34px;font-size:20px}.mh b{display:block}.mh small{font-size:10px;opacity:.85}
.mt{display:flex;gap:6px;padding:12px 14px 0}.mt button{flex:1;padding:10px;border-radius:12px;border:1.5px solid var(--b);background:#fff;color:var(--b);font-weight:600}.mt .on{background:var(--b);color:#fff}
.mb{padding:12px 14px 30px}
.dz{display:grid;gap:2px;text-align:center;padding:16px 8px;margin:0;border:2px dashed var(--o);border-radius:16px;background:#fff8ef;color:var(--b);font-size:14px;letter-spacing:0;text-transform:none;transition:.2s}.dz:active{transform:scale(.96)}.dz i{font-style:normal;font-size:28px}.dz small{font-size:11px;color:#6b7788}
.mpg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}
.th{position:relative;aspect-ratio:1;border-radius:12px;overflow:hidden;background:#dde3ec;animation:pop .3s}.th img,.th video{width:100%;height:100%;object-fit:cover}
.th button{position:absolute;top:4px;right:4px;width:22px;height:22px;border:0;border-radius:50%;background:#000a;color:#fff}
.th .ov,.th .ok{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:22px}.th .ov{background:#0b2f6d99}.th .ok{background:#2e7d3299;font-size:28px}
.pbar{height:8px;background:#dde3ec;border-radius:6px;overflow:hidden;margin:8px 0}.pbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--o),var(--gold));transition:width .3s}
.slip{background:#fde6ea;border:1px dashed #a5525f;padding:14px;margin-top:12px;font-family:"Courier New",Courier,monospace;font-size:11px;line-height:1.5;color:#222;animation:pop .5s}.slip b{display:block;font-size:14px;margin-bottom:4px}
.fl2{display:flex;gap:6px;overflow-x:auto;padding:4px 0 10px}.fl2 button{flex:0 0 auto;padding:7px 14px;border-radius:20px;border:1.5px solid var(--b);background:#fff;color:var(--b);font-size:12px;font-weight:600}.fl2 .on{background:var(--o);border-color:var(--o);color:#fff}
.wg{columns:2;column-gap:14px;padding-top:6px}.pl{break-inside:avoid;margin:0 0 16px;background:#fff;padding:7px 7px 3px;box-shadow:0 4px 12px #0003;position:relative;animation:pop .4s}
.pl:before{content:"";position:absolute;top:-8px;left:50%;width:40px;height:14px;background:#f4792055;transform:translateX(-50%) rotate(-3deg)}
.pl img{width:100%;display:block;min-height:90px;background:#dde3ec}.pl figcaption{padding:6px 2px;font-size:11px;line-height:1.25}.pl small{display:block;color:#6b7788}
.lb{position:fixed;inset:0;background:#000e;z-index:45;display:none;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#fff;padding:14px;text-align:center}.lb.open{display:flex}.lb img{max-width:100%;max-height:78vh;border:6px solid #fff;border-radius:4px}
