/* Light cartographic points, shared by the story anchors and booklet places. */
body .atlas-pin.catalog-pin,body.map-viewing .atlas-pin.catalog-pin{width:28px;height:28px;min-height:28px;padding:0;display:grid;place-items:center;background:none;border:0;box-shadow:none;border-radius:50%;clip-path:none;backdrop-filter:none;text-shadow:none}
.catalog-dot{width:8px;height:8px;border:1px solid #fff7db;border-radius:50%;background:var(--place-color);box-shadow:0 0 0 2px #fff3ca55;pointer-events:none;transition:opacity .25s,box-shadow .25s}
.is-featured .catalog-dot{width:11px;height:11px;box-shadow:0 0 0 3px #fff2c18c}
.is-complete .catalog-dot{border:2px solid #fffbe3}
.category-muted .catalog-dot{opacity:.23}
.category-match .catalog-dot{width:12px;height:12px;box-shadow:0 0 0 5px #ffefba80,0 0 20px var(--place-color)}
.catalog-label{display:none;position:absolute;left:26px;top:0;white-space:nowrap;font:12px/26px var(--sans);padding:0 7px;background:#fff5dbe8;border:1px solid #bca06a77;border-radius:3px;color:#65451f;pointer-events:none}
.labels-visible .show-label:not(.category-muted) .catalog-label,.catalog-pin:hover .catalog-label,.catalog-pin:focus-visible .catalog-label{display:block}
body .catalog-pin:hover,body .catalog-pin:focus-visible{z-index:15}
.catalog-pin:hover .catalog-dot,.catalog-pin:focus-visible .catalog-dot{box-shadow:0 0 0 5px #ffefbab0}
/* Keep the travel target small even as the map camera moves closer. */
.letter-atlas.chapter-travelling .atlas-pin.catalog-pin[aria-pressed=true]{background:none;border:0;outline:0;box-shadow:none;transition:none;z-index:16}
.letter-atlas.chapter-travelling .atlas-pin.catalog-pin[aria-pressed=true] .catalog-dot{width:8px;height:8px;background:#f7d990;border:1px solid #805b2e;border-radius:1px;box-shadow:0 0 0 2px #fff0c733;transform:rotate(45deg);opacity:1;visibility:visible;transition:none}
/* A quiet edge affordance reveals the categories without a permanent pill. */
#category-rail{position:absolute;left:0;top:50%;transform:translateY(-50%);z-index:18;width:24px;height:min(580px,calc(100% - 190px))}
#category-toggle{position:absolute;inset:0;width:24px;height:100%;padding:0;border:0;background:transparent;color:var(--glass-ink);border-radius:0}
#category-toggle::after{content:'';position:absolute;left:9px;top:calc(50% - 32px);width:2px;height:64px;border-radius:2px;background:#a57d3b66;transition:background .25s,height .25s}
#category-toggle:hover::after,#category-toggle:focus-visible::after{background:#8e642b;height:80px}
#category-toggle:focus-visible{outline:2px solid #9b753d;outline-offset:-3px}
#category-toggle:focus-visible::before{content:'地点分类';position:absolute;left:28px;top:50%;white-space:nowrap;font-size:13px}
#category-panel{position:absolute;left:24px;top:0;bottom:0;width:224px;overflow:auto;padding:12px;color:#71522e;opacity:0;visibility:hidden;transform:translateX(-18px);transition:opacity .24s,transform .3s,visibility .24s;overscroll-behavior:contain}
.categories-open #category-rail{width:248px}
.categories-open #category-toggle{width:24px}
.categories-open #category-panel{opacity:1;visibility:visible;transform:translateX(0)}
#category-panel button{min-height:44px;color:inherit}
#category-panel footer{display:flex;align-items:center;gap:6px;border-top:1px solid #b8955d33;margin-top:8px;padding-top:8px}
#category-close{width:44px;flex:0 0 44px;font-size:22px}
#category-buttons{display:grid;gap:3px}#category-buttons button{text-align:left;padding:9px 10px;font-size:13px}
.letter-atlas.categories-open .scroll-title{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .24s,visibility .24s}
.chapter-travelling #category-rail{visibility:hidden;pointer-events:none}
.chapter-travelling #category-panel{visibility:hidden}
.catalog-preview{width:100%;height:185px;object-fit:cover;border:1px solid #bca06a55}
.catalog-reader p{font-size:16px;line-height:2}
.catalog-reader h3{font:25px/1.5 var(--serif);margin:22px 0 14px}
.catalog-reader .catalog-gallery{width:100%;height:auto;margin:16px 0 8px}
.catalog-reader a{color:#e9c990;text-decoration:underline;text-underline-offset:3px}
.catalog-reader small{display:block;font-size:12px;line-height:1.8;color:#c3bca9}
#chapter-cinema.place-cinema #cinema-title{font-size:clamp(32px,4vw,68px);line-height:1.35;letter-spacing:3px}
.place-cinema #cinema-chapters{display:none}
.place-cinema .cinema-fiction{display:none}
.place-cinema #cinema-opening{font-size:18px}
/* The nine-category rail replaces the old four-theme strip and six-place dock. */
body.letter-atlas.tools-open .explore-toolbar,body.letter-atlas.tools-open .scene-dock{display:none}
body.letter-atlas.tools-open .map-scale{bottom:78px}

/* Clear pale-gold surfaces: low blur and restrained amber edge light. */
.letter-atlas{--glass-ink:#50391c;--glass-muted:#69512f;--glass-line:#caa25b66;--glass-surface:linear-gradient(125deg,#f7dfa72e,#e9c5800d 48%,#e2b66b24),#eccc8b26;--glass-shadow:inset 0 1px 1px #fae7b75c,inset -1px -1px 1px #b28b4526,0 8px 26px #6e563312}
.letter-atlas .drawer-open .place-panel,#category-panel,.letter-atlas .letter-dialog{
  background:var(--glass-surface);
  color:var(--glass-ink);border:1px solid var(--glass-line);border-radius:28px;
  backdrop-filter:blur(4px) saturate(1.04);-webkit-backdrop-filter:blur(4px) saturate(1.04);
  box-shadow:var(--glass-shadow);
  scrollbar-width:thin;scrollbar-color:#eee0bd66 transparent;
}
#category-panel{padding:12px;width:224px}
#category-buttons{gap:4px}
#category-buttons button{border:1px solid transparent;border-radius:14px;padding-left:12px;display:flex;align-items:center;gap:10px}
#category-buttons button::before{content:'';width:7px;height:7px;flex:0 0 7px;background:var(--category-color);border:1px solid #fff1c999;border-radius:50%;box-shadow:0 0 10px #fff1c933}
#category-buttons button:hover{background:#efcf8d2b}
#category-buttons button[aria-pressed=true]{background:linear-gradient(135deg,#efd08c4d,#d7ac5729);border-color:#b58c485c;box-shadow:inset 0 1px #f9e3ab4d}
#category-all-view{flex:1;margin-top:0;font-size:12px;border-radius:16px;border:1px solid #fff1ce55;background:#fff5da12}
#category-panel #category-status{top:0;left:0;margin:0;padding:0;color:var(--glass-muted)}
#category-close,#close-place{border-radius:50%}
#category-close:hover,#close-place:hover{background:#e8c47c33}
.letter-atlas .drawer-open .place-panel{width:400px;top:96px;bottom:auto;height:min(680px,calc(100dvh - 220px));max-height:none;overflow:auto;scrollbar-gutter:auto}
.letter-atlas .drawer-heading{min-height:56px;padding:6px 16px 6px 24px;background:transparent;border-color:#b89b6333;color:var(--glass-ink)}
.letter-atlas .drawer-heading button,.letter-atlas .drawer-tabs button{color:var(--glass-ink)}
.letter-atlas .drawer-tabs{background:transparent;border-color:#b89b6333;padding:4px 16px 10px}
.letter-atlas .drawer-tabs button{border-radius:14px;border:1px solid transparent}
.letter-atlas .drawer-tabs button[aria-pressed=true]{color:#59401e;background:#fff0cf18;border:1px solid #fff0cf55}
.letter-atlas .detail-open .drawer-tabs{display:none}
.letter-atlas .detail-open .place-panel{overflow:hidden;display:flex;flex-direction:column}
.letter-atlas .detail-open .drawer-heading{flex:0 0 56px}
.letter-atlas .place-detail{padding:12px 24px 22px;min-height:0;flex:1;display:grid;grid-template-rows:auto auto minmax(70px,1fr) auto auto auto 50px;gap:10px;color:var(--glass-ink)}
.letter-atlas .place-detail[hidden]{display:none}
.letter-atlas .place-detail:focus{outline:none}
.detail-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.letter-atlas .detail-back{min-height:36px;color:#75582e;font-size:12px;letter-spacing:1px}
.detail-category{font-size:11px;letter-spacing:1px;padding:5px 10px;border-radius:20px;border:1px solid #b89b6340;color:var(--glass-muted)}
.letter-atlas .place-detail h3{font:400 26px/1.3 var(--serif);color:#59401e;letter-spacing:1px;margin:0}
.detail-photo{margin:0;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:5px}
.detail-photo .catalog-preview{height:100%;min-height:0;width:100%;object-fit:cover;border:1px solid #fff1cf40;border-radius:18px;box-shadow:0 4px 18px #1d373122}
.detail-photo figcaption{font-size:10px;line-height:1.5;color:var(--glass-muted);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.detail-hook{font:400 20px/1.4 var(--serif);color:#8a642b;margin:0}
.letter-atlas .place-detail .detail-lead{font:14px/1.8 var(--sans);color:#675234;margin:0}
.detail-location{font-size:12px;color:var(--glass-muted);line-height:28px;text-decoration:none}
.detail-location:hover{text-decoration:underline}
.letter-atlas .place-detail .primary-button{width:100%;min-height:50px;border-radius:25px;border:1px solid #b68b4566;background:linear-gradient(115deg,#f2d28955,#d7ad5b40);color:#644721;font:15px var(--serif);letter-spacing:2px;padding:10px 16px;box-shadow:0 4px 16px #99722f12,inset 0 1px #fae6b34d}
.letter-atlas .place-detail .primary-button:hover{background:#f2d68a66;transform:translateY(-1px)}
.letter-atlas .place-panel .place-count{color:var(--glass-muted)}
.letter-atlas .place-panel .place-card{border:1px solid #fff0ce33;border-radius:18px;background:#fff6dd0c;color:var(--glass-ink)}
.letter-atlas .place-panel .place-card:hover{background:#fff5dd1c}
.letter-atlas .place-panel .place-card strong,.letter-atlas .place-panel .place-card small,.letter-atlas .place-panel .place-tag{color:#6f5128}
.letter-atlas .place-panel .place-card span,.letter-atlas .place-panel .explore-search label{color:#715c3c}
.letter-atlas .place-panel input,.letter-atlas .place-panel select{background:#edd39d38;border-radius:12px;color:var(--glass-ink)}
.letter-atlas .place-panel .story-directory-entry{border-radius:16px}
.letter-atlas .place-panel .story-panel{color:var(--glass-ink)}
.letter-atlas .place-panel .story-panel h2,.letter-atlas .place-panel .story-panel h3{color:#6f5128}
.letter-atlas .place-panel .story-directory-entry{color:var(--glass-ink);background:#fff5dd0c;border-color:#fff0ce33}
.letter-atlas .place-panel .story-directory-entry small{color:var(--glass-muted)}
.letter-atlas .place-panel .story-eyebrow,.letter-atlas .place-panel .story-fiction,.letter-atlas .place-panel .story-hint,.letter-atlas .place-panel .story-storage,.letter-atlas .place-panel .story-back{color:var(--glass-muted)}
.letter-atlas .letter-dialog p,.letter-atlas .letter-dialog button,.letter-atlas .letter-dialog a,.letter-atlas .letter-dialog .eyebrow,.letter-atlas .letter-dialog .fiction-label{color:var(--glass-muted)}
#cinema-scroll{border-radius:26px;border-color:#fff3d347;background:linear-gradient(135deg,#b4c8c021,#b9d9da09),#152a30a3;backdrop-filter:blur(26px) saturate(1.2);box-shadow:inset 0 1px #fff5df33,0 18px 65px #0002}
.cinema-header button,.travel-actions button{border-radius:24px;backdrop-filter:blur(18px)}
.catalog-reader .catalog-gallery{border-radius:16px}
#cinema-chapters{display:none}
.cinema-photo-note{max-width:31%}
#cinema-places{width:min(52%,640px);display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:14px}
#cinema-places button{min-width:0;padding:10px 18px;border-radius:24px;border:1px solid #fff0cf50;background:linear-gradient(130deg,#fff2d516,#c6dbdd0c);backdrop-filter:blur(18px);text-align:left;transition:background .2s,border-color .2s}
#cinema-places button:hover{background:#fff1cc24;border-color:#ffe8b7}
#cinema-places button small{display:block;color:#f0d4a0;font-size:10px;letter-spacing:2px}
#cinema-places button span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:14px/1.8 var(--serif)}
#cinema-places #cinema-next-place{text-align:right}
#cinema-place-index{font-size:11px;white-space:nowrap;color:#e9d9b9}
.place-cinema #cinema-progress{display:none}
#chapter-cinema.scene-leave{opacity:0;transition:opacity .22s ease;pointer-events:none}
#chapter-cinema.scene-leave::backdrop{background:transparent;transition:background .22s}
/* Shared floating controls, with fixed anchors independent of drawer state. */
.letter-atlas .map-regions,.letter-atlas .atlas-controls,.letter-atlas .map-caption,
.letter-atlas .map-viewbar,.letter-atlas #explore-toggle{
  background:var(--glass-surface);color:var(--glass-ink);border:1px solid var(--glass-line);
  border-radius:30px;box-shadow:var(--glass-shadow);
  backdrop-filter:blur(2px) saturate(1.04);-webkit-backdrop-filter:blur(2px) saturate(1.04);
}
.letter-atlas .map-regions button,.letter-atlas .atlas-controls button,.letter-atlas .map-caption button{color:var(--glass-ink);border:0;background:transparent;border-radius:24px}
.letter-atlas .map-regions button[aria-pressed=true]{background:linear-gradient(135deg,#efd08c4d,#d7ac5729);box-shadow:inset 0 1px #f9e3ab4d;color:#694a20}
.letter-atlas .map-regions button:hover,.letter-atlas .atlas-controls button:hover,.letter-atlas .map-caption button:hover{background:#efcf8d33}
.letter-atlas .atlas-controls button:disabled{background:transparent}
.letter-atlas #explore-toggle{color:#6c5129}
.letter-atlas #explore-toggle i{color:#a77832}
.letter-atlas :is(#category-panel,#place-panel,.map-regions,.atlas-controls,.map-caption,.map-viewbar,#category-toggle,#explore-toggle) :focus-visible{outline:2px solid #9b753d;outline-offset:2px}
@media(min-width:701px){
  .letter-atlas.tools-open .map-regions{top:104px;left:50%;right:auto;transform:translateX(-50%);padding:5px;gap:4px}
  .letter-atlas .map-regions button{min-height:44px;padding:8px 18px}
  .letter-atlas .atlas-controls,.letter-atlas .drawer-open .atlas-controls{right:4%;bottom:56px;grid-template-columns:repeat(4,44px);gap:4px;padding:5px}
  .letter-atlas .atlas-controls button{min-height:44px;width:44px}
  .letter-atlas.tools-open .map-caption{top:auto;bottom:56px;right:calc(4% + 210px);left:auto;gap:2px;padding:5px}
  .letter-atlas .map-caption button{min-height:44px;padding:8px 12px;font-size:11px}
  .letter-atlas .map-viewbar{left:auto;right:4%;bottom:56px;transform:none}
}
@media(max-height:820px){
  .letter-atlas .place-detail{gap:8px;padding:8px 22px 18px;grid-template-rows:auto auto minmax(70px,1fr) auto auto auto 48px}
  .letter-atlas .place-detail h3{font-size:24px}.detail-hook{font-size:18px}
  .letter-atlas .place-detail .primary-button{min-height:48px}
  #cinema-places{gap:10px}#cinema-places button{padding:7px 14px}
}

/* Keep the story invitation and saved progress together, without a second floating card. */
.letter-atlas .scroll-title{transition:opacity .24s}
.letter-atlas .scroll-title #begin{display:flex;align-items:center;justify-content:space-between;width:230px;text-align:left}
.letter-atlas .scroll-title #story-beacon{position:static;display:block;min-height:44px;max-width:none;margin:0 0 0 26px;padding:6px 0;background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;color:#81683f;font:12px/1.5 var(--serif);letter-spacing:1px;text-align:left}
.letter-atlas .scroll-title #story-beacon[hidden]{display:none}
.letter-atlas .scroll-title #story-beacon::after{display:none}
.letter-atlas .scroll-title #story-beacon:hover{color:#63451f;text-decoration:underline;text-underline-offset:4px}
.letter-atlas .scroll-title #story-beacon:focus-visible{outline:2px solid #9b753d;outline-offset:3px}

.detail-actions{display:flex;gap:8px;min-height:50px}.detail-actions .primary-button{flex:1;min-width:0}.letter-atlas .detail-actions .story-related{flex:0 0 72px;border-radius:24px;background:#efd49524;padding:8px;font-size:13px;text-align:center}.letter-atlas .detail-actions:has(.story-related) .primary-button{font-size:13px;letter-spacing:1px;padding-inline:8px}
