/* Original transparent artwork, tucked beneath the leather; existing controls stay intact. */
.cryptid-tabbed-journal {isolation:isolate;overflow:visible}
.cryptid-tabbed-journal > img {position:relative;z-index:1}
.cryptid-tabbed-journal > div:not(.cryptid-divider-tabs) {z-index:2}
.cryptid-divider-tabs {position:absolute;inset:0;z-index:0;pointer-events:none}
/* Fixed labels sit partly beneath the main book; only the neighboring covers move. */
.cryptid-divider-tab {position:absolute;top:5%;width:32%;aspect-ratio:1.06;pointer-events:auto;color:#000;text-decoration:none}
.tab-previous {left:-5%}
.tab-next {right:-5%}
.cryptid-divider-tab .cryptid-neighbor-cover {position:absolute;inset:0;width:100%;height:auto;filter:saturate(.45);transition:filter .3s ease,transform .3s ease}
.tab-previous .cryptid-neighbor-cover {transform:translate(-1.5%,1.5%)}
.tab-next .cryptid-neighbor-cover {transform:translate(1.5%,1.5%)}
.cryptid-cover-label-art {position:absolute;top:50%;transform:translateY(-50%);width:35%;height:auto;z-index:1}
.tab-previous .cryptid-cover-label-art {left:2%}
.tab-next .cryptid-cover-label-art {right:2%}
.cryptid-divider-tab span {position:absolute;top:50%;transform:translate(-50%,-50%);writing-mode:vertical-rl;font:clamp(8px,1.05vw,15px) Georgia,serif;white-space:nowrap;z-index:2;paint-order:stroke fill;-webkit-text-stroke-width:1px}
.tab-previous span {left:18%;-webkit-text-stroke-color:#c00000}
.tab-next span {left:82%;-webkit-text-stroke-color:#008000}
.tab-previous:is(:hover,:focus-visible) .cryptid-neighbor-cover {transform:translate(-4%,-4%);filter:saturate(1)}
.tab-next:is(:hover,:focus-visible) .cryptid-neighbor-cover {transform:translate(4%,-4%);filter:saturate(1)}
.cryptid-divider-tab:focus-visible {outline:2px solid #e8b640;outline-offset:2px}
@media(prefers-reduced-motion:reduce) {.cryptid-divider-tab .cryptid-neighbor-cover {transition:none;transform:none}}

/* Rectangular page-turn targets, using the supplied arrow artwork. */
nav.aed-page-controls {margin:-58px auto 50px;gap:clamp(10px,3vw,38px);align-items:center}
nav.aed-page-controls .aed-page-turn {display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:170px;min-height:130px;padding:8px 12px;background:transparent;border:0;border-radius:0;color:#f3dfb5;cursor:pointer;font:26px Georgia,serif;box-sizing:border-box}
.aed-arrow-frame {display:flex;align-items:center;justify-content:center;width:150px;height:96px;pointer-events:none}
.aed-arrow-frame img {display:block;width:64px;height:auto;transition:filter .2s ease,transform .2s ease;pointer-events:none}
.aed-turn-left img {transform:rotate(-90deg)}
.aed-turn-right img {transform:rotate(90deg)}
.aed-page-label {display:block;margin-top:5px;transition:color .2s ease,text-shadow .2s ease;pointer-events:none}
.aed-page-turn:not(:disabled):is(:hover,:focus-visible) .aed-page-label {color:#e8b640;text-decoration:none;text-shadow:0 0 7px rgba(232,182,64,.85),0 0 15px rgba(232,182,64,.45)}
.aed-page-turn:not(:disabled):is(:hover,:focus-visible) img {filter:brightness(1.15)}
nav.aed-page-controls .aed-page-turn:disabled {opacity:.4;cursor:default}
nav.aed-page-controls .aed-page-turn:focus-visible {outline:2px solid #e8b640;outline-offset:2px}
@media(max-width:480px) {
 nav.aed-page-controls {gap:4px;flex-wrap:nowrap}
 nav.aed-page-controls .aed-page-turn {min-width:118px;padding:8px 4px;font-size:20px}
 .aed-arrow-frame {width:110px;height:82px}
 .aed-arrow-frame img {width:54px}
 nav.aed-page-controls output {font-size:13px;text-align:center}
}
@media(prefers-reduced-motion:reduce) {.aed-arrow-frame img,.aed-page-label {transition:none}}

/* Slightly smaller labels in narrower windows, still centered on the covers. */
@media(max-width:900px) {
 .cryptid-cover-label-art {width:31%}
 .tab-previous .cryptid-cover-label-art {left:6%}
 .tab-next .cryptid-cover-label-art {right:6%}
 .tab-previous span {left:20%}
 .tab-next span {left:80%}
 .cryptid-divider-tab span {font-size:clamp(8px,1vw,10px)}
}

/* Only the visible divider label is interactive; the book is decorative. */
@media (min-width: 601px) {
 .cryptid-divider-tab {pointer-events:none}
 .cryptid-divider-tab .cryptid-neighbor-cover {pointer-events:none}
 .cryptid-divider-tab .cryptid-cover-label-art,
 .cryptid-divider-tab span {pointer-events:auto;cursor:pointer}
 .cryptid-divider-tab:focus-visible {outline:none}
 .cryptid-divider-tab:focus-visible .cryptid-cover-label-art {
   outline:2px solid #e8b640;outline-offset:2px;
 }
}