/* Historical archive: the approved menu's room remains the background. */
#menu.codexOn .mnPanelHead, #menu.codexOn .mnPanelFoot { display:none; }
#menu.codexOn .mnPanel::after { background:linear-gradient(90deg,#080a08bd,#0e100dbc 58%,#11120fa8); }
#menu.codexOn .mnPanelBody { overflow:hidden; }
.hcRoot { flex:1; min-width:0; min-height:0; display:flex; flex-direction:column; padding:3.5vh 5.1vw 2.2vh; box-sizing:border-box; color:#eeeee7; }
.hcRoot *, .hcRoot *::before, .hcRoot *::after { box-sizing:border-box; }
.hcRoot button, .hcRoot a { -webkit-tap-highlight-color:transparent; }
.hcRoot button { color:inherit; font:inherit; border:0; background:none; cursor:pointer; }
.hcRoot button:disabled { opacity:.3; cursor:default; }
.hcRoot button:focus-visible, .hcRoot a:focus-visible, .hcViewport:focus-visible { outline:2px solid #edca83; outline-offset:4px; }
.hcHeader { flex:0 0 auto; padding-bottom:1.1vh; border-bottom:1px solid #c1bdab55; }
.hcHeader p, .hcHeader h1, .hcArticle h2, .hcCardTitle, .hcRestoration h2 { font-family:"TzTitleText",var(--ui-title-font); font-weight:700; }
.hcHeader p { margin:0; font-size:var(--menu-font-section); line-height:1.4; letter-spacing:.045em; }
.hcHeader h1 { margin:0; font-size:var(--menu-font-page); line-height:1.17; letter-spacing:.08em; }
.hcCategories { display:flex; flex:0 0 auto; align-items:center; gap:clamp(14px,3.9vw,76px); min-height:7.1vh; overflow-x:auto; white-space:nowrap; scrollbar-width:thin; }
.hcCategories button { flex:0 0 auto; min-height:44px; padding:9px 4px; font-size:var(--menu-font-nav-small); letter-spacing:.08em; border-bottom:3px solid transparent; }
.hcCategories button.selected { color:#edca83; border-bottom-color:#edca83; }
.hcCategories button:hover { color:#edca83; }
.hcScroll { flex:1; min-height:0; overflow:auto; scrollbar-width:thin; scrollbar-color:#a89c75 #15171155; padding:4px; margin:-4px; }
.hcGrid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:14px; align-content:start; }
.hcGrid.all { min-height:100%; grid-auto-rows:minmax(210px,auto); }
.hcCard { grid-column:span 2; display:flex; gap:clamp(13px,1.5vw,27px); min-width:0; min-height:235px; text-align:left; padding:16px; position:relative; border:1px solid #c1bdab52!important; background:#11130d36!important; }
.hcCard::before { content:""; position:absolute; inset:-1px auto -1px -1px; width:4px; background:transparent; }
.hcCard.selected, .hcCard:hover { border-color:#dbc18d99!important; background:#d8d4c30c!important; }
.hcCard.selected::before, .hcCard:hover::before { background:#edca83; }
.hcCardArt { display:flex; flex:0 0 42%; min-width:0; align-items:center; justify-content:center; overflow:hidden; }
.hcCardArt img, .hcCardArt svg { width:100%; height:100%; object-fit:contain; max-height:34vh; }
.hcCardCopy { display:flex; flex:1; flex-direction:column; min-width:0; justify-content:center; gap:10px; }
.hcKicker { color:#edca83; font-size:var(--menu-font-meta); }
.hcCardTitle { font-size:var(--menu-font-nav); line-height:1.4; overflow-wrap:anywhere; }
.hcCardDate { color:#d5d4ca; font-size:var(--menu-font-meta); letter-spacing:.025em; }
.hcCardSummary { color:#d5d4ca; font-size:var(--menu-font-body); line-height:1.65; }
.hcCardCaption { color:#aaa99d; font-size:var(--menu-font-small); line-height:1.5; margin-top:auto; padding-top:8px; }
.hcFooter { flex:0 0 auto; min-height:6.3vh; display:flex; gap:22px; align-items:center; padding-top:12px; color:#d5d4ca; font-size:var(--menu-font-meta); }
.hcFooter button { min-height:40px; text-align:left; padding:5px 0; }
.hcFooter button:hover, .hcDetailHead button:hover { color:#edca83; }
.hcFooterEnd { margin-left:auto; display:flex; gap:28px; }
.hcKeyHint { color:#a6a69a; font-size:var(--menu-font-small); }
.hcDetail { min-height:100%; height:100%; display:flex; flex-direction:column; border:1px solid #c1bdab55; background:#0b0e093b; }
.hcDetailHead { display:flex; flex:0 0 auto; justify-content:space-between; align-items:center; gap:20px; padding:8px 1.5vw; min-height:50px; border-bottom:1px solid #c1bdab32; font-size:var(--menu-font-meta); }
.hcDetailHead button { min-height:36px; white-space:nowrap; }
.hcDetailHead span { color:#c3c3b8; text-align:right; }
.hcDetailBody { flex:1; min-height:0; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:2.3vw; padding:1.7vh 1.8vw; }
.hcKind-people { grid-template-columns:minmax(0,.7fr) minmax(0,1.85fr); }
.hcArticle { min-width:0; min-height:0; overflow:auto; scrollbar-width:thin; padding-right:6px; font-size:var(--menu-font-body); line-height:1.6; }
.hcKind-people .hcSection { padding:10px 0; }
.hcKind-people .hcArticle { display:flex; flex-direction:column; overflow:hidden; }
.hcBiographyCopy { flex:1; min-height:0; overflow:auto; scrollbar-width:thin; }
.hcKind-people .hcRelated { flex:0 0 auto; }
.hcArticle h2 { margin:0 0 7px; font-size:var(--menu-font-heading); line-height:1.3; }
.hcSubtitle { color:#e7c582; font-size:var(--menu-font-section); margin:0 0 12px; }
.hcRole { margin:0 0 12px; }
.hcSection { padding:14px 0; border-top:1px solid #c1bdab44; }
.hcSection h3, .hcStage h3, .hcRelated h3 { color:#edca83; margin:0 0 7px; font-size:var(--menu-font-section); font-weight:500; }
.hcSection p { margin:0; }
.hcPortrait { min-height:0; margin:0; display:flex; flex-direction:column; align-items:center; gap:12px; }
.hcPortrait img { display:block; min-height:0; max-height:100%; max-width:100%; flex:1; width:100%; object-fit:contain; }
.hcPortrait figcaption { flex:0; text-align:center; color:#c4c3b6; font-size:var(--menu-font-small); line-height:1.6; }
.hcRelated { display:flex; align-items:center; flex-wrap:wrap; gap:12px; border-top:1px solid #c1bdab44; padding-top:15px; margin-top:17px; }
.hcRelated h3 { margin:0; }
.hcRelated button { display:flex; justify-content:space-between; gap:20px; border:1px solid #c1bdab55; padding:9px 15px; font-size:var(--menu-font-body); }
.hcRelated button span { color:#edca83; }
.hcRelated button:hover { background:#d8d4c314; }
.hcTimeline { display:flex; margin:20px 0 12px; justify-content:space-between; gap:8px; position:relative; }
.hcTimeline::before { content:""; position:absolute; top:8px; left:5%; right:5%; height:1px; background:#b7b19b; }
.hcTimeline > div, .hcTimeline > button { flex:1; text-align:center; display:flex; align-items:center; flex-direction:column; gap:7px; position:relative; z-index:1; min-width:0; }
.hcTimeline i { width:16px; height:16px; border:1px solid #d5cfb8; border-radius:50%; background:#8f8d7e; }
.hcTimeline span { font-size:var(--menu-font-body); }
.hcTimeline small { font-size:var(--menu-font-small); white-space:normal; }
.hcTimeline .selected { color:#edca83; }
.hcTimeline .selected i { background:#edca83; box-shadow:0 0 0 3px #c5a66655; }
.hcBattleVisual { display:flex; min-height:0; flex-direction:column; gap:10px; overflow:auto; scrollbar-width:thin; }
.hcMap { display:block; width:100%; min-height:130px; flex:1; max-height:39vh; object-fit:contain; overflow:hidden; font-family:var(--ui-font); }
.hcBattleVisual > small { color:#aaa99b; font-size:12px; }
.hcContextScan { display:block; width:100%; flex:1; min-height:130px; max-height:39vh; object-fit:contain; }
.hcBattleVisual .hcTimeline { margin:8px 0; flex:0; }
.hcStage { flex:0; border:1px solid #c1bdab44; border-left:4px solid #edca83; padding:10px 13px; }
.hcStage p { margin:0; color:#d5d4ca; font-size:var(--menu-font-meta); line-height:1.7; }
.hcReader { display:flex; flex-direction:column; min-height:0; min-width:0; gap:8px; }
.hcViewport { position:relative; overflow:hidden; min-height:150px; min-width:0; flex:1; display:flex; justify-content:center; align-items:center; background:#090c0866; }
.hcViewport.zoomed { cursor:grab; }
.hcViewport.zoomed:active { cursor:grabbing; }
.hcScan { flex:none; display:block; max-width:none; max-height:none; transform-origin:center; user-select:none; }
.hcReaderTools { flex:0 0 auto; display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:9px; color:#e5e4da; font-size:var(--menu-font-meta); }
.hcReaderTools button { border:1px solid #c1bdab44; padding:6px 10px; min-height:34px; }
.hcReaderTools button:hover:not(:disabled) { color:#edca83; border-color:#edca83; }
.hcZoom { min-width:45px; text-align:center; }
.hcPaging { display:flex; align-items:center; gap:10px; white-space:nowrap; }
.hcReaderHint { flex:0; color:#aaa99b; font-size:12px; }
.hcReader.expanded { position:fixed; inset:3vh 3vw; z-index:80; padding:20px; background:#090c08fa; border:1px solid #c1bdab77; box-shadow:0 0 0 5vw #000b; }
/* Documents are bound paper. The original scan is always the page texture. */
.hcKind-documents { grid-template-columns:minmax(0,1.65fr) minmax(280px,.9fr); }
.hcBookReader { gap:15px; padding:8px 8px 0; }
.hcBookViewport { position:relative; flex:1; min-height:220px; min-width:0; touch-action:none; user-select:none; isolation:isolate; }
.hcBookViewport:focus-visible { outline:1px solid #d9c28c80; outline-offset:9px; }
.hcBookHost.stf__parent { width:100%!important; height:100%; min-width:0!important; min-height:0!important; position:relative; z-index:1; }
.hcBookHost .stf__wrapper { width:100%; height:100%; padding:0!important; }
.hcBookBoard { position:absolute; background:#3c3220; border-radius:2px 4px 5px 2px; transform:translateY(3px); box-shadow:0 3px 0 #c2b9a4,0 5px 0 #7c7462,0 7px 0 #a99e85,0 10px 0 #302a1f,0 15px 26px #000a,0 0 0 5px #332e21; pointer-events:none; }
.hcBookPage { background:#faf9f4; color:#342f25; overflow:hidden; border:1px solid #d9d5c9; }
.hcBookPage img { width:100%; height:100%; display:block; object-fit:contain; user-select:none; pointer-events:auto; }
.hcBookPage img:not([src]) { visibility:hidden; }
.hcBookPage::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,#0002,transparent 6%,transparent 94%,#0001); }
.hcBookPage.--left::after { background:linear-gradient(90deg,#0001,transparent 4%,transparent 83%,#2b20140b 92%,#271e1338); }
.hcBookPage.--right::after { background:linear-gradient(90deg,#271e1340,#2b20140b 8%,transparent 17%,transparent 96%,#0001); }
.hcBookFlyleaf { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px; padding:12%; text-align:center; background:linear-gradient(90deg,#eeeadf,#f9f6ed 22%,#f4f0e5 90%,#e1dacb); }
.hcBookFlyleaf h3 { font-family:"TzTitleText",var(--ui-title-font); font-size:clamp(17px,1.6vw,29px); line-height:1.7; font-weight:500; letter-spacing:.08em; margin:0; }
.hcBookFlyleaf p { font-size:clamp(11px,.9vw,16px); margin:0; line-height:1.8; }
.hcBookFlyleaf small { font-size:clamp(10px,.75vw,13px); color:#80745f; letter-spacing:.12em; line-height:1.7; }
.hcBookFlyleaf small:first-child { margin-bottom:24px; padding-bottom:15px; border-bottom:1px solid #ac9c7866; }
.hcBookFlyleaf small:last-child { margin-top:38px; }
.hcBookPageError { position:absolute; inset:15%; display:grid; place-content:center; color:#695e4c; font-size:14px; line-height:1.8; }
.hcBookPageError[hidden] { display:none; }
.hcBookFailure { position:absolute; inset:30%; z-index:10; color:#d6c6a5; }
.hcBookFoot { display:flex; align-items:center; gap:8px; flex:none; min-height:25px; padding:0 3px; font-size:var(--menu-font-small); color:#b6b0a0; }
.hcBookFolio { margin-left:auto; white-space:nowrap; color:#d5ccb8; }
.hcBookKey { width:24px; height:25px; padding:0; opacity:0; }
.hcBookKey:focus-visible,.hcBookFoot:hover .hcBookKey:not(:disabled) { opacity:1; }
.hcBookReader[data-book-orientation="portrait"] .hcBookGesture { font-size:11px; }
.hcBookLens { position:fixed; inset:0; width:94vw; height:94vh; max-width:none; max-height:none; padding:15px; border:1px solid #bfb29966; background:#15160ff5; color:#d8d0bd; }
.hcBookLens[open] { display:flex; flex-direction:column; gap:12px; }
.hcBookLens::backdrop { background:#050704d9; }
.hcBookLensClose { align-self:flex-end; min-height:35px; padding:5px 14px!important; border:1px solid #bfb29966!important; }
.hcBookLensViewport { flex:1; min-height:0; display:flex; align-items:center; justify-content:center; overflow:hidden; touch-action:none; }
.hcBookLensViewport img { flex:none; max-width:none; max-height:none; user-select:none; }
.hcBookLensViewport.zoomed { cursor:grab; }.hcBookLensViewport.zoomed:active { cursor:grabbing; }
.hcBookLens small { text-align:center; color:#a9a28f; font-size:12px; }
.hcReadTabs { display:flex; gap:26px; border-bottom:1px solid #c1bdab44; margin:16px 0; }
.hcReadTabs button { padding:8px 0; border-bottom:3px solid transparent; color:#c3c3b8; }
.hcReadTabs button.selected { color:#edca83; border-bottom-color:#edca83; }
.hcContents { border-top:1px solid #c1bdab44; padding-top:15px; display:flex; flex-direction:column; gap:5px; }
.hcContents button { text-align:left; min-height:37px; padding:4px 12px; border-left:2px solid #a29e88; }
.hcContents .selected { color:#edca83; border-left-color:#edca83; }
.hcSourceNote { font-size:var(--menu-font-meta); color:#aaa99b; margin:17px 0 0; line-height:1.75; }
.hcHeadline { font-family:"TzTitleText",var(--ui-title-font); font-size:var(--menu-font-section); line-height:1.5; margin:25px 0 0; }
.hcSection blockquote { margin:5px 0; padding-left:14px; border-left:2px solid #b5a580; color:#e5e4da; }
.hcDescription { margin:25px 0; }
.hcMetadata { display:grid; grid-template-columns:auto 1fr; gap:5px 26px; border-top:1px solid #c1bdab44; padding-top:20px; }
.hcMetadata dt { color:#aaa99b; } .hcMetadata dd { margin:0; }
.hcSources { width:min(850px,90vw); max-height:85vh; padding:0; border:1px solid #d2c5a377; color:#e5e4da; background:#10130ff5; font-family:var(--ui-font); }
.hcSources::backdrop { background:#030603c9; }
.hcSourcesInner { padding:26px; }
.hcSourcesHead { display:flex; justify-content:space-between; align-items:start; gap:20px; border-bottom:1px solid #c1bdab44; }
.hcSourcesHead h2 { margin:0 0 18px; font-family:"TzTitleText",serif; font-size:var(--menu-font-section); }
.hcSources button { min-height:42px; padding:5px 14px; color:#edca83; }
.hcSourceList { list-style:none; padding:0; margin:10px 0 25px; }
.hcSourceList li { padding:15px 0; border-bottom:1px solid #c1bdab33; font-size:15px; line-height:1.7; }
.hcSourceList a { color:#edca83; text-decoration:none; }
.hcSourceList a:hover { text-decoration:underline; }
.hcSourceList p { color:#c3c3b8; margin:8px 0 0; }
.hcRestoration { padding:20px; background:#090c0866; color:#c3c3b8; font-size:14px; line-height:1.9; }
.hcRestoration h2 { color:#e5e4da; font-size:var(--menu-font-heading); }.hcRestoration h4 { color:#edca83; font-size:var(--menu-font-section); }
.hcImageError { color:#c9bea5; padding:20px; text-align:center; }.hcBroken { opacity:.5; }
/* Fact and invention: the game's own notes. Marks read full, half, hollow, dashed, as on the card. */
.hcKind-creation { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); }
.hcMarkPanel { min-width:0; min-height:0; overflow:auto; scrollbar-width:thin; padding-right:6px; font-size:var(--menu-font-body); line-height:1.65; }
.hcMarkPanel .hcSection:first-child { border-top:0; padding-top:0; }
.hcMarkPanel .hcSection p { color:#d5d4ca; }
.hcMarks { display:flex; flex-direction:column; gap:7px; margin-top:8px; }
.hcMarks button { display:grid; grid-template-columns:16px minmax(0,1fr) auto; align-items:center; gap:4px 12px; text-align:left; padding:10px 14px 11px; border:1px solid #c1bdab44; border-left:4px solid transparent; }
.hcMarks button:hover { background:#d8d4c30c; }
.hcMarks button.selected { border-color:#dbc18d99; border-left-color:#edca83; background:#d8d4c30c; }
.hcMarkName { font-size:var(--menu-font-section); }
.hcMarks button.selected .hcMarkName { color:#edca83; }
.hcMarkCount { color:#d5d4ca; font-size:var(--menu-font-meta); white-space:nowrap; }
.hcMarks small { grid-column:2 / 4; color:#aaa99b; font-size:var(--menu-font-small); line-height:1.55; }
.hcMark { display:inline-block; flex:none; width:15px; height:15px; border-radius:50%; border:2px solid #e1c17e; }
.hcMark-recorded { background:#e1c17e; }
.hcMark-similar { background:linear-gradient(90deg,#e1c17e 50%,transparent 50%); }
.hcMark-invented { border-color:#e3d6b3; }
.hcMark-pending { border-style:dashed; border-color:#b4a281; }
.hcMarkHead { margin:6px 0 4px; }
.hcMarkHead h3 { display:flex; align-items:center; gap:10px; }
.hcMarkItem h3 { color:#eeeee7; }
.hcMarkItem p { color:#d5d4ca; }
.hcMarkItem .hcMarkRefs { display:flex; flex-wrap:wrap; gap:4px 18px; margin-top:8px; font-size:var(--menu-font-meta); }
.hcMarkRefs > span { color:#aaa99b; }
.hcMarkRefs a { color:#edca83; text-decoration:none; overflow-wrap:anywhere; }
.hcMarkRefs a:hover { text-decoration:underline; }
@media(max-height:760px) and (min-width:901px) {
  .hcRoot { padding-top:2vh; }.hcHeader p { font-size:var(--menu-font-section); }.hcHeader h1 { font-size:var(--menu-font-page); }
  .hcCategories { min-height:53px; }.hcCategories button { font-size:var(--menu-font-nav-small); }
  .hcGrid.all { grid-template-rows:repeat(2,minmax(170px,1fr)); }.hcCard { min-height:170px; padding:11px; }.hcCardCopy { gap:5px; }
  .hcCardTitle { font-size:var(--menu-font-nav); }.hcCardSummary,.hcCardDate { font-size:13px; }.hcCardCaption { font-size:11px; }
  .hcArticle { font-size:var(--menu-font-body); line-height:1.7; }.hcArticle h2 { font-size:var(--menu-font-heading); }.hcSubtitle { font-size:var(--menu-font-section); }
  .hcSection { padding:10px 0; }.hcSection h3 { font-size:var(--menu-font-section); }.hcDetailHead { min-height:42px; }
  .hcRelated { margin-top:10px; padding-top:10px; }.hcRelated h3 { font-size:var(--menu-font-section); }.hcRelated button { font-size:13px; padding:7px 10px; }
}
@media(max-width:1100px) {
  .hcCard { gap:12px; }.hcCardArt { flex-basis:38%; }.hcKeyHint { display:none; }
  .hcReaderTools { gap:5px; }.hcReaderTools button { padding:5px 7px; }.hcPaging { gap:5px; }
}
@media(max-width:900px) {
  .hcRoot { padding:20px 5% 10px; }.hcHeader p { font-size:var(--menu-font-section); }.hcHeader h1 { font-size:var(--menu-font-page); }
  .hcCategories { min-height:58px; gap:25px; }.hcCategories button { font-size:var(--menu-font-nav-small); }
  .hcGrid,.hcGrid.all { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:none; height:auto; }
  .hcCard,.hcGrid.all .hcCard:nth-child(n) { grid-column:span 1; min-height:230px; }.hcCard:last-child { grid-column:span 2!important; }
  .hcCardArt { flex-basis:40%; }.hcCardArt img,.hcCardArt svg { max-height:240px; }
  .hcDetail { height:auto; min-height:100%; }.hcDetailBody { display:flex; flex-direction:column; padding:18px; gap:25px; }
  .hcArticle { overflow:visible; font-size:var(--menu-font-body); }.hcArticle h2 { font-size:var(--menu-font-heading); }.hcSubtitle { font-size:var(--menu-font-section); }
  .hcKind-people .hcArticle,.hcBiographyCopy,.hcMarkPanel { display:block; overflow:visible; }
  .hcPortrait img { max-height:50vh; width:auto; }.hcReader { height:65vh; min-height:390px; flex:none; }
  .hcMap { max-height:350px; flex:auto; }.hcBattleVisual { overflow:visible; }
  .hcReader.expanded { height:auto; min-height:0; }.hcFooter { gap:10px; padding-top:8px; }.hcFooterEnd { gap:15px; }
}
@media(max-width:580px) {
  .hcHeader p { font-size:var(--menu-font-section); }.hcHeader h1 { font-size:var(--menu-font-page); }
  .hcGrid,.hcGrid.all { display:flex; flex-direction:column; }.hcCard { min-height:200px; }
  .hcCardTitle { font-size:var(--menu-font-nav); }.hcCardDate,.hcCardSummary { font-size:14px; }.hcCardCaption { font-size:12px; }
  .hcDetailHead { flex-wrap:wrap; padding:10px 14px; gap:5px; }.hcDetailHead span { font-size:11px; }
  .hcFooterEnd { gap:10px; }.hcFooter { font-size:11px; }
  .hcRestoration .mnCodexRow { grid-template-columns:1fr; gap:3px; }
}
.hcBookFlyleafContent { display:flex; flex-direction:column; align-items:center; justify-content:center; height:100%; gap:20px; }

.hcBookFlyleaf h3, .hcBookFlyleaf p { text-wrap:balance; }