/* 时间旅行照相馆: timeline map, flip cards, postcard studio and passport. */
.chapter-grid.time-line{display:flex;gap:14px;overflow-x:auto;padding:10px 4px 24px;scroll-snap-type:x mandatory;position:relative}
.chapter-grid.time-line::before{content:"";position:absolute;left:0;right:0;top:56%;height:3px;background:repeating-linear-gradient(90deg,var(--accent) 0 12px,transparent 12px 20px);opacity:.5}
.time-stop{position:relative;flex:0 0 200px;scroll-snap-align:start;display:flex;flex-direction:column;padding:0;border:0;border-radius:6px;background:var(--panel);color:var(--ink);text-align:left;box-shadow:0 14px 30px -18px rgb(80 50 30/.6);transform:rotate(-1.2deg);transition:transform .35s var(--spring)}
.time-stop:nth-child(even){transform:rotate(1.4deg)}
.time-stop:hover{transform:translateY(-6px) rotate(0)}
.time-stop img{aspect-ratio:4/3;object-fit:cover;width:100%;border:8px solid var(--panel);border-bottom:0}
.time-stop span{padding:8px 12px 12px}.time-stop small{display:block;font-size:13px;color:var(--accent);font-weight:700}.time-stop b{font-size:16px}
.time-stop.stamped::after{content:"✓ 已盖邮戳";position:absolute;right:10px;top:10px;background:var(--accent);color:var(--on-accent);font-size:12.5px;font-weight:800;padding:2px 9px;border-radius:999px;transform:rotate(8deg)}
.fact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.fact-grid .flip-card{width:100%}.fact-grid .flip-face span{font-size:15px}
.postcard-studio{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,1fr);gap:18px;align-items:start}
.postcard-studio .interactive-canvas{border-radius:6px;box-shadow:0 30px 50px -30px rgb(60 30 20/.7);transform:rotate(-.6deg)}
.studio-tools{display:grid;gap:14px}
.studio-row{display:grid;gap:6px}.studio-row>b{font-size:15px;color:var(--muted)}
.chip-button{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--line);background:var(--panel);color:var(--ink);border-radius:999px;padding:6px 12px;font-size:14.5px}
.chip-button[aria-pressed=true]{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--panel));font-weight:700}
.chip-button .swatch{width:14px;height:14px;border-radius:50%;border:1px solid rgb(0 0 0/.15)}
.sticker-tray{display:flex;gap:10px}
.sticker-btn{width:76px;height:76px;border-radius:16px;border:2px dashed var(--line);background-color:var(--panel);background-size:300% auto;background-repeat:no-repeat;transition:transform .25s var(--spring)}
.sticker-btn:hover{transform:scale(1.08) rotate(-4deg);border-color:var(--accent)}
.passport{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}
.passport-stamp{display:grid;justify-items:center;text-align:center;gap:4px;padding:12px;border-radius:16px;background:var(--panel);border:2px dashed var(--line);opacity:.5;filter:grayscale(1)}
.passport-stamp img{width:86px;height:86px;border-radius:50%;object-fit:cover;border:4px double var(--accent)}
.passport-stamp b{font-size:14.5px}.passport-stamp small{font-size:12.5px;color:var(--muted)}
.passport-stamp.got{opacity:1;filter:none;border-style:solid;border-color:var(--accent);transform:rotate(-2deg)}
@media (max-width:900px){.postcard-studio{grid-template-columns:1fr}}
@media (max-width:720px){.fact-grid{grid-template-columns:1fr}.time-stop{flex-basis:160px}.sticker-btn{width:64px;height:64px}}