@charset "UTF-8";
#moments-room { position:fixed; inset:0; z-index:55; display:grid; grid-template-rows:72px minmax(0,1fr); color:var(--color-ink-1); background:var(--color-paper-1); visibility:hidden; opacity:0; pointer-events:none; transform:translateY(10px); transition:opacity 400ms ease,transform 650ms var(--ease-camera),visibility 0s 650ms; }
#moments-room[data-state="open"] { visibility:visible; opacity:1; pointer-events:auto; transform:none; transition-delay:0s; }
#moments-room [hidden] { display:none!important; }
#moments-room button,.f-memory-years button { font-family:var(--font-ui); color:inherit; cursor:pointer; }
#moments-room button { border:0; background:none; }
#moments-room button:focus-visible,.f-memory-years button:focus-visible { outline:2px solid var(--color-accent); outline-offset:4px; }
#moments-room button:disabled { opacity:.35; cursor:default; }
.p-bar { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 clamp(20px,3.3vw,56px); border-bottom:1px solid var(--color-border-soft); }
.p-bar button { justify-self:start; min-height:44px; padding:0; font-size:var(--text-sm); }
.p-bar h2 { font:400 var(--text-lg)/1.4 var(--font-body); letter-spacing:.14em; margin:0; }
.p-body { overflow-y:auto; overscroll-behavior:contain; padding:24px clamp(20px,5vw,90px) 48px; scrollbar-width:thin; }
.p-heading { max-width:1000px; margin:0 auto 20px; }
.p-heading>span { font:var(--text-sm)/1.5 var(--font-latin); letter-spacing:.24em; color:var(--color-ink-3); }
.p-heading h3 { font:400 clamp(34px,4vw,46px)/1.35 var(--font-body); letter-spacing:.14em; margin:6px 0; }
.p-heading p { font:var(--text-base)/1.9 var(--font-body); margin:0; color:var(--color-ink-2); }
.p-tools { max-width:1000px; margin:0 auto 20px; padding:8px 0; border-top:1px solid var(--color-border-soft); border-bottom:1px solid var(--color-border-soft); }
.p-years,.f-memory-years { display:flex; flex-wrap:wrap; gap:8px; }
.p-years button,.f-memory-years button { min-height:38px; padding:6px 14px; border:1px solid transparent; background:none; border-radius:2px; font-size:var(--text-sm); }
#moments-room .p-years button[aria-pressed="true"],.f-memory-years button[aria-pressed="true"] { background:var(--color-accent-wash); border-color:var(--color-accent-soft); color:var(--color-ink-1); }
.p-collection { max-width:1000px; margin:0 auto; padding-left:24px; border-left:1px solid var(--color-border); }
.p-moment { position:relative; padding-bottom:22px; margin-bottom:24px; border-bottom:1px solid var(--color-border-soft); }
.p-moment:before { content:""; position:absolute; top:5px; left:-30px; width:10px; height:10px; border:1px solid var(--color-accent); border-radius:50%; background:var(--color-paper-1); }
.p-moment-meta { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 14px; margin-bottom:10px; }
.p-moment-meta time { font:var(--text-sm)/1.8 var(--font-mono); color:var(--color-ink-3); }
.p-location,#field-room .f-location { font:var(--text-sm)/1.7 var(--font-ui); color:var(--color-ink-3); overflow-wrap:anywhere; }
#field-room .f-location { margin:4px 0 8px; }
.p-post-text { margin:0 0 14px; }
.p-post-text p,.f-moment-text p { white-space:pre-wrap; overflow-wrap:anywhere; }
.p-post-text p { font:var(--text-base)/1.85 var(--font-body); margin:0 0 8px; }
.p-post-text p:last-child { margin-bottom:0; }
.p-post-text a,.f-moment-text a { color:var(--color-accent); text-underline-offset:4px; }
.p-post-images { display:block; columns:3; column-gap:8px; }
.p-post-images[data-images="2"],.p-post-images[data-images="4"],.f-moment-grid[data-images="2"],.f-moment-grid[data-images="4"] { columns:2; max-width:620px; }
.p-post-images[data-images="8"] { columns:4; }
.p-post-images[data-images="1"] { columns:1; max-width:420px; }
.p-post-images button { display:block; width:100%; padding:0; margin:0 0 8px; break-inside:avoid; }
.p-post-images img { display:block; width:100%; height:auto; background:var(--color-paper-2); }
.p-post-images>button:only-child img { width:auto; height:auto; max-width:100%; max-height:330px; }
.p-lightbox { position:absolute; inset:0; z-index:2; display:grid; grid-template-columns:64px minmax(0,1fr) 64px; grid-template-rows:64px minmax(0,1fr); background:var(--color-paper-1); }
.p-lightbox header { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; padding:0 28px; font:var(--text-sm) var(--font-mono); }
.p-lightbox button { min-width:44px; min-height:44px; font-size:var(--text-base); }
.p-lightbox figure { margin:0; min-height:0; display:flex; flex-direction:column; align-items:center; gap:12px; padding:0 0 22px; }
.p-lightbox img { display:block; width:100%; min-height:0; flex:1; object-fit:contain; }
.p-lightbox figcaption { max-width:100%; overflow-wrap:anywhere; text-align:center; font:var(--text-xs)/1.5 var(--font-ui); color:var(--color-ink-3); }
.f-memory-tools { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-bottom:20px; padding-bottom:12px; border-bottom:1px solid var(--color-border-soft); }
.f-records { max-width:900px; margin:auto; position:relative; padding-left:30px; border-left:1px solid var(--color-border); }
.f-record { position:relative; }
.f-moment { padding-bottom:22px; margin-bottom:24px; }
.f-record>time:before { content:none; }
.f-record:before { content:""; position:absolute; top:5px; left:-36px; width:10px; height:10px; border:1px solid var(--color-accent); border-radius:50%; background:var(--color-paper-1); }
.f-records .f-moment-grid { columns:3; column-gap:8px; margin-top:12px; }
.f-records .f-moment-grid[data-images="2"],.f-records .f-moment-grid[data-images="4"] { columns:2; max-width:620px; }
.f-records .f-moment-grid[data-images="1"] { columns:1; max-width:420px; }
.f-records .f-moment-grid .f-image { display:block; width:100%; margin:0 0 8px; break-inside:avoid; }
.f-moment-grid .f-image img { width:100%; height:auto; }
.f-moment-grid .f-image:only-child { max-width:420px; grid-column:1/-1; }
.f-moment-grid .f-image:only-child img { width:auto; max-width:100%; max-height:330px; height:auto; }
.f-memory-empty { font:var(--text-base)/1.9 var(--font-body); color:var(--color-ink-3); padding:24px 0; }
@media (max-width:767px) {
  #moments-room { grid-template-rows:60px minmax(0,1fr); }
  .p-bar { padding:0 16px; }
  .p-bar h2 { font-size:var(--text-md); }
  .p-body { padding:18px 16px 40px; }
  .p-heading { margin-bottom:16px; }
  .p-heading h3 { font-size:34px; }
  .p-heading p { font-size:var(--text-sm); }
  .p-tools { margin-bottom:16px; }
  .p-years button,.f-memory-years button { padding:6px 10px; }
  .p-collection { padding-left:18px; }
  .p-moment:before { left:-24px; }
  .p-moment { padding-bottom:18px; margin-bottom:20px; }
  .p-post-text p { font-size:var(--text-base); }
  .p-post-images,.p-post-images[data-images="8"] { columns:3; column-gap:6px; }
  .p-post-images>button:only-child img,.f-moment-grid .f-image:only-child img { max-height:270px; }
  .p-lightbox { grid-template-columns:40px minmax(0,1fr) 40px; }
  .p-lightbox header { padding:0 16px; }
  .p-lightbox button { min-width:36px; }
  .f-records { padding-left:18px; }
  .f-record:before { left:-24px; }
  .f-records .f-moment-grid { gap:6px; }
}
@media (prefers-reduced-motion:reduce) { #moments-room { transition:none; } }
.p-bar{display:flex;align-items:center;justify-content:flex-start;padding:0 clamp(20px,3.3vw,56px)}
.p-bar h2{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.p-bar{display:flex!important;align-items:center!important;justify-content:flex-start!important;grid-template-columns:none!important}
.p-bar h2{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important}