.snapshot-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:start;padding-bottom:40px}
.snapshot-grid.is-measured{grid-auto-rows:8px}
.snapshot-grid-card{min-width:0;align-self:start;overflow-wrap:anywhere}
/* A single sheet with its bottom-right corner folded over. ::before is the paper: its background leaves the corner
   transparent (26px legs = 18.38px along the diagonal), and drop-shadow follows that outline, so the paper keeps its
   shadow on every edge including the fold while the cut-away corner shows the page. Shadows use the same neutral
   tone as the photo prints, so nothing tints the page yellow. ::after is the folded flap lying on the paper. */
.snapshot-grid-card.text-note{color:#414b37}
.snapshot-grid-card.text-note .snapshot-grid-copy{position:relative;z-index:1}
.snapshot-grid-card.text-note::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(315deg,transparent 18.38px,#f6eaba 18.38px,#fcf3ca);
  filter:drop-shadow(0 0 .6px rgba(53,59,40,.32)) drop-shadow(1px 6px 6px rgba(53,59,40,.12)) drop-shadow(0 2px 1.5px rgba(53,59,40,.09))}
.snapshot-grid-card.text-note::after{content:"";position:absolute;right:0;bottom:0;z-index:0;width:26px;height:26px;pointer-events:none;
  background:linear-gradient(135deg,#fbf2cc 0%,#efe2a8 42%,#e2d293 50%,transparent 50%);
  filter:drop-shadow(-1px -1px 1.5px rgba(53,59,40,.18))}
/* Photo cards are white prints, same paper as the home viewer's .print. */
.snapshot-grid-card.has-photos{background:#fffdf7;border:1px solid #e4e0d5;border-radius:3px;box-shadow:1px 7px 14px #353b2821,0 2px 3px #353b2818;padding:12px;color:#5c6353}
.snapshot-grid-photos .snapshot-grid-photo{position:absolute;inset:0}.snapshot-grid-photo[hidden]{display:none}
.snapshot-grid-photo{display:block;width:100%;height:100%;margin:0;padding:0;border:0;background:none;cursor:zoom-in}
.snapshot-grid-photo:focus-visible{outline:2px solid var(--green,#9b452e);outline-offset:3px}
.snapshot-grid-photos img{display:block;width:100%;height:100%;object-fit:contain;border-radius:2px}
/* Several photos in one snapshot: switch at the bottom of the photo (same look as the home viewer). */
.photo-frame{position:relative;aspect-ratio:var(--photo-ratio,auto)}.photo-nav{position:absolute;left:50%;bottom:8px;z-index:3;display:flex;align-items:center;gap:2px;padding:2px;border-radius:999px;background:rgba(24,24,20,.46);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;transform:translateX(-50%);transition:opacity .2s ease}.photo-nav button{display:grid;place-items:center;width:30px;height:30px;margin:0;padding:0 0 2px;border:0;border-radius:50%;background:none;color:#fff;font:400 21px/1 system-ui,sans-serif;cursor:pointer;-webkit-tap-highlight-color:transparent}.photo-nav button:hover{background:#ffffff2e}.photo-nav button:focus-visible{outline:2px solid #fff;outline-offset:-2px}.photo-nav-dots{display:flex;gap:4px;padding:0 2px}.photo-nav-dots i{display:block;width:8px;height:3px;border-radius:1px;background:#ffffff6e;transition:background .2s}.photo-nav-dots i.is-on{background:#fff}@media(hover:hover) and (pointer:fine){.photo-nav{padding:6px 7px;background:rgba(24,24,20,.34);pointer-events:none;transition:padding .2s ease,background .2s ease}.photo-nav button{width:0;height:0;opacity:0;overflow:hidden;pointer-events:auto;transition:width .2s ease,height .2s ease,opacity .15s ease}.photo-frame:hover .photo-nav,.photo-frame:focus-within .photo-nav{padding:2px;background:rgba(24,24,20,.46)}.photo-frame:hover .photo-nav button,.photo-frame:focus-within .photo-nav button{width:30px;height:30px;opacity:1}}@media(pointer:coarse){.photo-nav button{width:34px;height:34px}}@media(prefers-reduced-motion:reduce){.photo-nav,.photo-nav button,.photo-nav-dots i{transition:none}}
.snapshot-grid-copy{padding:18px 0 4px}
.snapshot-grid-card.has-photos .snapshot-grid-copy{padding:13px 7px 5px}
.snapshot-grid-card.has-photos .snapshot-grid-copy p{margin-bottom:8px}
.snapshot-grid-card.text-note .snapshot-grid-copy p{color:#776c48}
.snapshot-grid-card.text-note .snapshot-grid-copy{padding:24px}
.snapshot-grid-copy h2{font-size:var(--type-card,20px);line-height:1.5;font-weight:550;margin:0 0 12px}
.snapshot-grid-card.text-note .snapshot-grid-copy h2{font-weight:500}
.snapshot-grid-copy p{white-space:pre-wrap;font-size:var(--type-body,16px);line-height:1.8;margin:0 0 20px}
/* Dated strip of translucent paper tape on the card corner (same look as the home viewer's .photo-date-tape). */
.snapshot-grid-card{position:relative}
.snapshot-grid-card.text-note .snapshot-grid-copy{padding-top:108px}
.snapshot-grid-tape{position:absolute;left:10px;top:23px;z-index:3;isolation:isolate;display:block;padding:7px 22px;color:#665a3d;font:550 var(--type-card,20px)/1.5 var(--mono,ui-monospace,SFMono-Regular,Consolas,monospace);letter-spacing:.04em;white-space:nowrap;text-decoration:none;transform:rotate(-9deg);transform-origin:center center}
.snapshot-grid-tape::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,#eee1b4dc,#f6eac8e8 45%,#ead8a4d9);clip-path:polygon(2% 0,98% 2%,96% 16%,100% 29%,97% 43%,100% 60%,97% 78%,99% 100%,1% 98%,3% 82%,0 66%,3% 48%,0 31%,3% 14%);box-shadow:inset 0 1px 0 #fff8,inset 0 -1px 0 #ab8d4c44}
.snapshot-grid-tape,.snapshot-grid-tape:hover,.snapshot-grid-tape:visited{color:#665a3d}
.snapshot-grid-tape time{display:block}
.snapshot-grid-tape .record-time{display:block;margin:0;text-align:right;color:inherit;font-size:13px;line-height:1.3;font-weight:400;letter-spacing:.02em}
.snapshot-grid-tape{-webkit-appearance:none;appearance:none;border:0;background:none;margin:0;text-align:left;cursor:pointer;transition:transform .15s ease}
.snapshot-grid-tape:hover{transform:rotate(-9deg) translateY(-1px)}.snapshot-grid-tape:active{transform:rotate(-9deg) translateY(1px)}
.snapshot-grid-tape:focus-visible{outline:2px solid var(--green,#5b6b4a);outline-offset:4px}
/* A shared link's card: scrolled into view and highlighted for a moment. */
.snapshot-grid-card{scroll-margin:16px 0 32px}
.snapshot-grid-card.is-target.is-lit{animation:snapshot-target 2.8s ease-out both}
@keyframes snapshot-target{0%,40%{box-shadow:0 0 0 3px #c9963dcc,0 0 26px 6px #e8c26a88}100%{box-shadow:0 0 0 3px #c9963d00,0 0 26px 6px #e8c26a00}}
@media(prefers-reduced-motion:reduce){.snapshot-grid-card.is-target.is-lit{animation:none;box-shadow:0 0 0 3px #c9963dcc}}
.snapshot-grid-toast{position:fixed;left:50%;bottom:28px;z-index:100;transform:translate(-50%,8px);padding:9px 16px;border-radius:6px;background:#343e2d;color:#fff;font-size:14px;line-height:1.5;box-shadow:0 6px 20px #0003;opacity:0;pointer-events:none;transition:opacity .18s,transform .18s}
.snapshot-grid-toast.is-shown{opacity:1;transform:translate(-50%,0)}
/* Copy hint: appears just above the pointer, holds, then drifts up while fading out. */
.snapshot-grid-float{position:fixed;z-index:100;padding:5px 11px;border-radius:999px;background:#343e2d;color:#fff;font-size:13px;line-height:1.4;white-space:nowrap;box-shadow:0 4px 14px #0003;pointer-events:none;transform:translate(-50%,calc(-100% - 12px));animation:snapshot-float 1.3s linear forwards}
/* Fade in, hold still long enough to read, then rise and fade out together. */
@keyframes snapshot-float{0%{opacity:0;transform:translate(-50%,calc(-100% - 8px));animation-timing-function:ease-out}10%{opacity:1;transform:translate(-50%,calc(-100% - 12px))}45%{opacity:1;transform:translate(-50%,calc(-100% - 12px));animation-timing-function:cubic-bezier(.4,0,.6,1)}100%{opacity:0;transform:translate(-50%,calc(-100% - 52px))}}
@media(prefers-reduced-motion:reduce){.snapshot-grid-float{animation:snapshot-float-still 1.1s linear forwards}@keyframes snapshot-float-still{0%,60%{opacity:1}100%{opacity:0}}}
.snapshot-grid-pagination{padding:0 0 40px}
.snapshot-grid-pagination .page-navigator{flex-wrap:wrap}
.snapshot-grid-empty{padding:24px 0 60px;color:var(--muted,#777a72)}
@media(max-width:900px){.snapshot-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}}
@media(max-width:700px){.snapshot-grid-card.has-photos{padding:10px}}
@media(max-width:600px){.snapshot-grid{grid-template-columns:minmax(0,1fr);gap:24px}.snapshot-grid.is-measured{grid-auto-rows:auto}.snapshot-grid-card{grid-row-end:auto!important}}
.snapshot-page-heading{padding:48px 0 28px}
.snapshot-page-heading h1{font-size:var(--type-section,26px);line-height:1.35;font-weight:600;margin:0}
.snapshot-page-description{font-size:var(--type-body,16px);color:var(--muted,#777a72);line-height:1.8;margin:12px 0 0}
.snapshot-grid-foot{display:flex;justify-content:flex-end;margin-top:4px}
.snapshot-grid-card.text-note .snapshot-grid-copy p{margin-bottom:12px}
.snapshot-grid-replies{position:relative;z-index:4;flex:0 0 36px;width:36px;height:36px;display:grid;place-items:center;isolation:isolate;transform:rotate(8deg);filter:drop-shadow(1px 2px 1px #0005);color:#263c43;font:700 15px/1 var(--mono,ui-monospace,monospace);font-variant-numeric:tabular-nums;text-decoration:none}
.snapshot-grid-replies{margin:0;padding:0;border:0;background:none;cursor:pointer;appearance:none}
.snapshot-grid-replies:hover{color:#263c43}
/* No replies yet: a plain white sticker; with replies the holo foil follows the cursor (desktop) or the scroll (touch). */
.post-reply-sticker.is-empty::before{background:#cdc8bd;transition:none}.post-reply-sticker.is-empty::after{inset:1px;z-index:-1;opacity:1;background:linear-gradient(160deg,#fffefb 0%,#fbfaf6 55%,#f3f1eb 100%);transition:none}
.snapshot-grid-replies:focus-visible{outline:2px solid var(--green,#9b452e);outline-offset:5px}
/* Single snapshot page: one card, then the native comments. */
.snapshot-single{max-width:680px;margin:40px auto 75px;min-width:0}
.snapshot-single>.back-link{margin-bottom:30px}
.snapshot-single-card .snapshot-grid-copy h1{font-size:var(--type-section,26px);line-height:1.4;font-weight:600;margin:0 0 14px}
.snapshot-single-card .snapshot-grid-card.text-note .snapshot-grid-copy h1{font-weight:500}
.snapshot-single #comments{margin-top:48px}
@media(max-width:600px){.snapshot-single{margin:30px auto 45px}}
.snapshot-search-slot{min-width:0;align-self:start}
/* Photo preview: the photo alone at the largest size that fits, over a dimmed and blurred page; any click closes.
   Same look as the home viewer. The full-window dialog itself dims and blurs (::backdrop stays clear for WebKit). */
.snapshot-preview{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:16px;border:0;border-radius:0;background:rgba(0,0,0,.72);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:none;outline:none;overflow:hidden;cursor:zoom-out}
.snapshot-preview[open]{display:flex;align-items:center;justify-content:center}
.snapshot-preview::backdrop{background:transparent}
.snapshot-preview img{display:block;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;border-radius:2px;box-shadow:0 12px 40px #0008}
@media(max-width:600px){.snapshot-preview{padding:8px}}
.lightbox-count,.snapshot-preview-count{position:absolute;left:50%;bottom:14px;padding:3px 10px;border-radius:999px;background:rgba(0,0,0,.45);color:#fff;font:500 12px/1.4 ui-monospace,monospace;letter-spacing:.06em;transform:translateX(-50%);pointer-events:none}.snapshot-preview.is-gallery img{cursor:pointer}
.snapshot-grid-photo .video-badge,.video-badge{position:absolute;left:50%;top:50%;z-index:2;display:flex;align-items:center;gap:8px;padding:8px 15px 8px 13px;border-radius:999px;background:rgba(20,20,18,.55);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;font:500 14px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.04em;transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 2px 10px #0003}.video-badge i{width:0;height:0;border-style:solid;border-width:7px 0 7px 11px;border-color:transparent transparent transparent #fff}
.snapshot-preview video{display:block;width:auto;height:auto;max-width:100%;max-height:100%;background:#000;border-radius:2px;box-shadow:0 12px 40px #0008;cursor:auto}.snapshot-preview video[hidden],.snapshot-preview img[hidden]{display:none}.snapshot-preview.is-video .snapshot-preview-count{top:14px;bottom:auto}
/* 0.5.0 Markdown text */
.snapshot-grid-copy .snapshot-grid-text{margin:0 0 20px;font-size:var(--type-body,16px);line-height:1.8;overflow-wrap:anywhere}.snapshot-grid-copy .snapshot-grid-text p{white-space:normal;font-size:inherit;line-height:inherit}.snapshot-grid-copy .snapshot-grid-text>*{margin:0}.snapshot-grid-copy .snapshot-grid-text>*+*{margin-top:.6em}
.md-text p{margin:0}.md-text.md-text>*+*{margin-top:.6em}.md-text ul,.md-text ol{margin:0;padding-left:1.4em;text-align:left}.md-text li+li{margin-top:.15em}.md-text blockquote{margin:0;padding:.1em 0 .1em .85em;border-left:3px solid rgba(0,0,0,.14);text-align:left;opacity:.9}.md-text code{font:.88em/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;background:rgba(0,0,0,.055);padding:.08em .32em;border-radius:3px;white-space:pre-wrap;overflow-wrap:anywhere}.md-text pre{margin:0;padding:.6em .75em;background:rgba(0,0,0,.05);border-radius:4px;white-space:pre-wrap;overflow-wrap:anywhere;text-align:left}.md-text pre code{background:none;padding:0}.md-text a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;overflow-wrap:anywhere;-webkit-user-drag:none}.md-text hr{border:0;border-top:1px dashed rgba(0,0,0,.2);margin:.9em 0}.md-text table{border-collapse:collapse;font-size:.9em;max-width:100%;display:block;overflow-x:auto;text-align:left}.md-text th,.md-text td{border:1px solid rgba(0,0,0,.14);padding:.2em .55em}.md-text th{font-weight:600}.md-text strong{font-weight:650}