/* Mystikamentis Library App v0.9.3
 * Visual shell: closed volumes -> physical opening -> true open-book spread.
 * Desktop = horizontal spread; mobile = vertical spread.
 */

.mystika-library-app {
    --mystika-app-paper: #18241d;
    --mystika-app-paper-2: #101a15;
    --mystika-app-paper-deep: #09110d;
    --mystika-app-paper-edge: rgba(221, 205, 158, 0.34);
    --mystika-app-ink: var(--mystika-text, #f1ead7);
    --mystika-app-gold: var(--mystika-gold, #d6b86b);
    --mystika-app-gold-soft: rgba(214, 184, 107, 0.62);
    --mystika-app-muted: var(--mystika-muted, #b9b09a);
    --mystika-app-line: var(--mystika-line, rgba(214, 184, 107, 0.34));
    position: relative;
    width: min(1160px, 100%);
    margin-inline: auto;
    min-width: 0;
    isolation: isolate;
}

.mystika-library-app [hidden] { display: none !important; }
.mystika-library-app button,
.mystika-library-app a,
.mystika-library-app select { -webkit-tap-highlight-color: transparent; }

.mystika-library-app__stage {
    position: relative;
    min-width: 0;
}

/* ================================================================
   CLOSED LIBRARY — PHYSICAL VOLUMES
   ================================================================ */

.mystika-library-app__closed-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(2.2rem, 7vw, 6.5rem);
    align-items: start;
    max-width: 860px;
    margin: 0 auto;
    padding: clamp(0.5rem, 2vw, 1.5rem) 0 clamp(1.2rem, 4vw, 3rem);
}

.mystika-library-app__closed-book {
    appearance: none;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    padding: 0;
    min-width: 0;
    cursor: pointer;
    text-align: center;
    display: grid;
    justify-items: center;
    gap: 1rem;
    perspective: 1450px;
}

.mystika-library-app__closed-cover {
    position: relative;
    display: block;
    width: min(100%, 300px);
    aspect-ratio: 5 / 7;
    transform-style: preserve-3d;
    transform: rotateY(-7deg) rotateZ(-0.45deg);
    transform-origin: 7% 50%;
    transition:
        transform 420ms cubic-bezier(.2,.72,.2,1),
        filter 280ms ease;
    filter: drop-shadow(0 24px 26px rgba(0,0,0,.38));
    z-index: 1;
}

/* page block behind the cover */
.mystika-library-app__closed-cover::before {
    content: "";
    position: absolute;
    z-index: -2;
    inset: 2.6% -5.2% 2.1% 3.2%;
    border-radius: 3px 12px 12px 4px;
    background:
        repeating-linear-gradient(180deg,
            rgba(232,220,184,.32) 0 1px,
            rgba(118,102,66,.14) 1px 2px,
            rgba(226,212,172,.22) 2px 4px),
        #8b7c59;
    box-shadow:
        7px 8px 10px rgba(0,0,0,.28),
        inset -5px 0 7px rgba(0,0,0,.28);
    transform: translateZ(-6px);
}

/* leather/board edge */
.mystika-library-app__closed-cover::after {
    content: "";
    position: absolute;
    z-index: 5;
    inset: 0;
    pointer-events: none;
    border: 1px solid rgba(224,193,111,.67);
    border-radius: 4px 12px 12px 4px;
    box-shadow:
        inset 0 0 0 3px rgba(7,15,11,.52),
        inset 0 0 0 4px rgba(214,184,107,.17),
        inset 11px 0 18px rgba(0,0,0,.48),
        inset -5px 0 9px rgba(255,235,180,.045);
}

.mystika-library-app__closed-book:hover .mystika-library-app__closed-cover,
.mystika-library-app__closed-book:focus-visible .mystika-library-app__closed-cover {
    transform: translateY(-9px) rotateY(-11deg) rotateZ(-0.2deg) scale(1.018);
    filter: drop-shadow(0 30px 34px rgba(0,0,0,.48));
}

.mystika-library-app__closed-book.is-opening .mystika-library-app__closed-cover {
    transform: translateX(-4%) translateY(-3px) rotateY(-72deg) rotateZ(0) scale(.98);
    filter: drop-shadow(0 13px 18px rgba(0,0,0,.34));
}

.mystika-library-app__closed-cover-image,
.mystika-library-app__closed-cover-placeholder {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border-radius: 4px 12px 12px 4px;
}

.mystika-library-app__closed-cover-image {
    display: block;
    object-fit: cover;
}

.mystika-library-app__closed-cover-placeholder {
    display: grid;
    place-items: center;
    background:
        radial-gradient(circle at 55% 28%, rgba(214,184,107,.18), transparent 35%),
        linear-gradient(145deg, #183226, #07120d 68%);
    color: rgba(214,184,107,.55);
    font-size: clamp(2.8rem, 8vw, 5rem);
}

.mystika-library-app__closed-shade {
    position: absolute;
    z-index: 2;
    inset: 0;
    border-radius: inherit;
    background:
        linear-gradient(90deg, rgba(0,0,0,.51), transparent 12%, transparent 80%, rgba(0,0,0,.32)),
        linear-gradient(180deg, rgba(0,0,0,.02) 34%, rgba(3,10,7,.72) 100%);
}

.mystika-library-app__closed-spine {
    position: absolute;
    z-index: 4;
    inset: 0 auto 0 0;
    width: 10.5%;
    border-right: 1px solid rgba(214,184,107,.32);
    border-radius: 4px 0 0 4px;
    background:
        linear-gradient(90deg, rgba(0,0,0,.64), rgba(214,184,107,.07) 45%, rgba(0,0,0,.34));
    box-shadow: 4px 0 12px rgba(0,0,0,.34);
}

.mystika-library-app__closed-title {
    position: absolute;
    z-index: 4;
    left: 14%;
    right: 8%;
    bottom: 9%;
    color: #ead39a;
    font-size: clamp(1rem, 2.25vw, 1.55rem);
    font-weight: 700;
    line-height: 1.14;
    letter-spacing: .055em;
    text-transform: uppercase;
    text-shadow:
        0 1px 0 rgba(255,246,215,.42),
        0 -1px 0 rgba(68,45,14,.92),
        0 2px 0 rgba(57,39,15,.7),
        0 7px 14px rgba(0,0,0,.76);
}

.mystika-library-app__closed-copy {
    display: grid;
    gap: .28rem;
    max-width: 28rem;
}

.mystika-library-app__closed-copy strong {
    color: var(--mystika-app-gold);
    font-size: clamp(1.05rem, 1.7vw, 1.35rem);
    line-height: 1.2;
}

.mystika-library-app__closed-copy span {
    color: var(--mystika-app-muted);
    line-height: 1.45;
    font-size: .9rem;
}

/* ================================================================
   READER HEADER
   ================================================================ */

.mystika-library-app__reader {
    position: relative;
}

.mystika-library-app__toolbar {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 1rem;
    width: min(1080px, calc(100% - 1rem));
    margin: 0 auto .75rem;
    min-height: 42px;
}

.mystika-library-app__close,
.mystika-library-app__online-link {
    appearance: none;
    border: 0;
    background: transparent;
    color: var(--mystika-app-muted);
    font: inherit;
    text-decoration: none;
    min-height: 38px;
    padding: .45rem .15rem;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    cursor: pointer;
    letter-spacing: .025em;
    transition: color 150ms ease, text-shadow 150ms ease;
}

.mystika-library-app__close { justify-self: start; }
.mystika-library-app__online-link { justify-self: end; }
.mystika-library-app__close:hover,
.mystika-library-app__close:focus-visible,
.mystika-library-app__online-link:hover,
.mystika-library-app__online-link:focus-visible {
    color: var(--mystika-app-gold);
    text-shadow: 0 0 14px rgba(214,184,107,.22);
}

.mystika-library-app__universe-name {
    margin: 0;
    color: var(--mystika-app-gold);
    text-align: center;
    font-size: clamp(1rem, 1.8vw, 1.2rem);
    font-weight: 700;
    letter-spacing: .035em;
}

/* ================================================================
   TRUE OPEN BOOK — DESKTOP
   ================================================================ */

.mystika-library-app__book-object {
    position: relative;
    width: min(1080px, calc(100% - 1rem));
    margin: 0 auto;
    perspective: 1800px;
    filter: drop-shadow(0 34px 34px rgba(0,0,0,.46));
}

/* visible page block underneath the spread */
.mystika-library-app__book-object::before {
    content: "";
    position: absolute;
    z-index: -2;
    left: 1.7%;
    right: 1.7%;
    top: 12px;
    bottom: -10px;
    border-radius: 34px 34px 26px 26px / 18px 18px 14px 14px;
    background:
        repeating-linear-gradient(180deg,
            rgba(226,213,174,.27) 0 1px,
            rgba(94,82,55,.12) 1px 2px,
            rgba(210,194,151,.19) 2px 4px),
        rgba(112,96,62,.62);
    box-shadow: 0 8px 18px rgba(0,0,0,.34);
}

.mystika-library-app__open-book {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 30px minmax(0, 1fr);
    align-items: stretch;
    height: clamp(590px, 57vw, 660px);
    min-height: 590px;
    transform-style: preserve-3d;
}

.mystika-library-app__page {
    position: relative;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    background:
        radial-gradient(ellipse at 52% 18%, rgba(230,202,128,.09), transparent 37%),
        radial-gradient(ellipse at 50% 108%, rgba(0,0,0,.28), transparent 48%),
        linear-gradient(94deg, var(--mystika-app-paper) 0%, #152019 66%, var(--mystika-app-paper-2) 100%);
    border: 1px solid rgba(214,184,107,.37);
    box-shadow:
        inset 0 0 42px rgba(0,0,0,.20),
        inset 0 0 2px rgba(246,227,177,.16);
    backface-visibility: hidden;
}

.mystika-library-app__page::before {
    content: "";
    position: absolute;
    inset: 8px;
    pointer-events: none;
    border: 1px solid rgba(214,184,107,.07);
    opacity: .88;
}

.mystika-library-app__page::after {
    content: "";
    position: absolute;
    pointer-events: none;
    top: 0;
    bottom: 0;
    width: 30px;
    opacity: .72;
}

.mystika-library-app__page--left {
    grid-column: 1;
    border-radius: 30px 8px 8px 28px / 19px 7px 7px 19px;
    transform-origin: 100% 50%;
    background:
        radial-gradient(ellipse at 48% 18%, rgba(230,202,128,.09), transparent 38%),
        linear-gradient(90deg, #111b16 0%, #18241d 68%, #0b130f 100%);
}

.mystika-library-app__page--left::after {
    left: 0;
    background: linear-gradient(90deg, rgba(0,0,0,.25), rgba(220,197,138,.035), transparent);
}

.mystika-library-app__page--right {
    grid-column: 3;
    border-radius: 8px 30px 28px 8px / 7px 19px 19px 7px;
    transform-origin: 0 50%;
    background:
        radial-gradient(ellipse at 52% 18%, rgba(230,202,128,.09), transparent 38%),
        linear-gradient(90deg, #0b130f 0%, #18241d 32%, #111b16 100%);
}

.mystika-library-app__page--right::after {
    right: 0;
    background: linear-gradient(270deg, rgba(0,0,0,.25), rgba(220,197,138,.035), transparent);
}

.mystika-library-app__spine {
    grid-column: 2;
    position: relative;
    z-index: 6;
    margin: 8px -7px 7px;
    border-radius: 48% / 2.5%;
    background:
        linear-gradient(90deg,
            transparent 0%,
            rgba(0,0,0,.38) 12%,
            rgba(0,0,0,.72) 33%,
            rgba(214,184,107,.075) 48%,
            rgba(0,0,0,.72) 67%,
            rgba(0,0,0,.38) 88%,
            transparent 100%);
    box-shadow:
        -10px 0 22px rgba(0,0,0,.26),
        10px 0 22px rgba(0,0,0,.26);
    pointer-events: none;
}

.mystika-library-app__spine::before,
.mystika-library-app__spine::after {
    content: "";
    position: absolute;
    left: 50%;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    transform: translateX(-50%);
    background: rgba(214,184,107,.15);
    box-shadow: 0 0 0 1px rgba(0,0,0,.34);
}
.mystika-library-app__spine::before { top: 5%; }
.mystika-library-app__spine::after { bottom: 5%; }

/* book-opening illusion */
.mystika-library-app__reader.is-entering .mystika-library-app__page--left {
    animation: mystika-page-left-open 560ms cubic-bezier(.2,.72,.2,1) both;
}
.mystika-library-app__reader.is-entering .mystika-library-app__page--right {
    animation: mystika-page-right-open 560ms cubic-bezier(.2,.72,.2,1) both;
}
.mystika-library-app__reader.is-entering .mystika-library-app__spine {
    animation: mystika-spine-appear 430ms 100ms ease both;
}

.mystika-library-app__reader.is-closing .mystika-library-app__page--left {
    animation: mystika-page-left-close 360ms cubic-bezier(.55,.06,.68,.19) both;
}
.mystika-library-app__reader.is-closing .mystika-library-app__page--right {
    animation: mystika-page-right-close 360ms cubic-bezier(.55,.06,.68,.19) both;
}
.mystika-library-app__reader.is-closing .mystika-library-app__spine {
    animation: mystika-spine-hide 300ms ease both;
}

@keyframes mystika-page-left-open {
    from { opacity: .36; transform: rotateY(76deg) scale(.94); }
    72% { opacity: 1; }
    to { opacity: 1; transform: rotateY(0) scale(1); }
}
@keyframes mystika-page-right-open {
    from { opacity: .36; transform: rotateY(-76deg) scale(.94); }
    72% { opacity: 1; }
    to { opacity: 1; transform: rotateY(0) scale(1); }
}
@keyframes mystika-page-left-close {
    from { opacity: 1; transform: rotateY(0); }
    to { opacity: .2; transform: rotateY(78deg) scale(.95); }
}
@keyframes mystika-page-right-close {
    from { opacity: 1; transform: rotateY(0); }
    to { opacity: .2; transform: rotateY(-78deg) scale(.95); }
}
@keyframes mystika-spine-appear { from { opacity: 0; transform: scaleY(.5); } to { opacity: 1; transform: scaleY(1); } }
@keyframes mystika-spine-hide { from { opacity: 1; } to { opacity: 0; } }

/* ================================================================
   LEFT PAGE — INDEX
   ================================================================ */

.mystika-library-app__index {
    padding: clamp(1.35rem, 2.6vw, 2.2rem) clamp(1.3rem, 2.7vw, 2.25rem) clamp(1.3rem, 2.2vw, 1.9rem);
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    gap: .85rem;
}

.mystika-library-app__group-nav {
    display: flex;
    gap: .72rem;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
    padding: 0 0 .35rem;
    margin: 0;
}
.mystika-library-app__group-nav::-webkit-scrollbar { display: none; }

.mystika-library-app__group-tab {
    flex: 0 0 auto;
    appearance: none;
    border: 0;
    border-bottom: 1px solid rgba(214,184,107,.2);
    background: transparent;
    color: var(--mystika-app-muted);
    padding: .28rem .05rem .42rem;
    font: inherit;
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .065em;
    cursor: pointer;
    white-space: nowrap;
    transition: color 140ms ease, border-color 140ms ease;
}

.mystika-library-app__group-tab:hover,
.mystika-library-app__group-tab:focus-visible,
.mystika-library-app__group-tab.is-active {
    color: var(--mystika-app-gold);
    border-bottom-color: var(--mystika-app-gold);
}

.mystika-library-app__group-select-wrap { display: none; }

.mystika-library-app__index-heading {
    padding: .45rem 0 .9rem;
    border-bottom: 1px solid rgba(214,184,107,.16);
}

.mystika-library-app__index-heading > span {
    display: block;
    color: rgba(214,184,107,.58);
    text-transform: uppercase;
    letter-spacing: .22em;
    font-size: .64rem;
    margin-bottom: .38rem;
}

.mystika-library-app__index-heading h2 {
    margin: 0;
    color: var(--mystika-app-gold);
    font-size: clamp(1.18rem, 2vw, 1.5rem);
    line-height: 1.2;
    font-weight: 600;
}

.mystika-library-app__index-heading p {
    margin: .55rem 0 0;
    color: var(--mystika-app-muted);
    line-height: 1.4;
    font-size: .82rem;
    max-width: 38ch;
}

.mystika-library-app__work-list {
    min-height: 0;
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(214,184,107,.25) transparent;
    padding-right: .2rem;
    mask-image: linear-gradient(to bottom, transparent 0, #000 8px, #000 calc(100% - 8px), transparent 100%);
}

.mystika-library-app__index-item {
    appearance: none;
    width: 100%;
    display: grid;
    grid-template-columns: 2.5rem minmax(0, 1fr) auto;
    column-gap: .72rem;
    align-items: baseline;
    border: 0;
    border-bottom: 1px solid rgba(214,184,107,.09);
    background: transparent;
    color: var(--mystika-app-ink);
    padding: .8rem .3rem .76rem .1rem;
    text-align: left;
    font: inherit;
    line-height: 1.28;
    cursor: pointer;
    position: relative;
    transition: color 140ms ease, padding-left 140ms ease, background 140ms ease;
}

.mystika-library-app__index-item::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 0;
    height: 1px;
    background: var(--mystika-app-gold);
    transform: translateY(-50%);
    transition: width 140ms ease;
}

.mystika-library-app__index-item small {
    grid-column: 2 / -1;
    color: var(--mystika-app-muted);
    margin-top: .12rem;
    font-size: .61rem;
    text-transform: uppercase;
    letter-spacing: .1em;
}

.mystika-library-app__index-item:hover,
.mystika-library-app__index-item:focus-visible,
.mystika-library-app__index-item.is-active {
    color: var(--mystika-app-gold);
    padding-left: .5rem;
    background: linear-gradient(90deg, rgba(214,184,107,.055), transparent 68%);
}
.mystika-library-app__index-item.is-active::before { width: .32rem; }

.mystika-library-app__index-number {
    color: rgba(214,184,107,.53);
    font-variant-numeric: tabular-nums;
    font-size: .72rem;
    letter-spacing: .07em;
    font-family: Georgia, "Times New Roman", serif;
}

/* ================================================================
   RIGHT PAGE — SELECTED WORK
   ================================================================ */

.mystika-library-app__display {
    padding: clamp(1.25rem, 2.35vw, 2rem) clamp(1.35rem, 2.7vw, 2.25rem);
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(214,184,107,.2) transparent;
}

.mystika-library-app__work.mystika-work {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    min-width: 0;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.mystika-library-app__work-main {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .78rem;
    text-align: center;
}

.mystika-library-app__cover-stage {
    min-width: 0;
    display: grid;
    place-items: center;
    width: 100%;
}

.mystika-library-app__cover-link {
    display: block;
    width: min(56%, 238px);
    line-height: 0;
}

.mystika-library-app__work-cover,
.mystika-library-app__cover-placeholder {
    width: min(56%, 238px);
    max-height: 330px;
    aspect-ratio: 5 / 7;
    display: block;
    object-fit: contain;
    background: rgba(0,0,0,.14);
    border: 1px solid rgba(214,184,107,.21);
    box-shadow:
        0 17px 27px rgba(0,0,0,.34),
        0 2px 0 rgba(231,214,169,.07);
}

.mystika-library-app__cover-link .mystika-library-app__work-cover { width: 100%; }

.mystika-library-app__cover-placeholder {
    display: grid;
    place-items: center;
    color: rgba(214,184,107,.42);
    font-size: 2.4rem;
}

.mystika-library-app__work-copy {
    min-width: 0;
    width: min(100%, 430px);
    display: grid;
    justify-items: center;
}

.mystika-library-app .mystika-status-label,
.mystika-library-app .mystika-work--path .mystika-status-label {
    align-self: auto;
    margin: .08rem 0 .3rem;
    padding: .18rem .42rem;
    font-size: .56rem;
    letter-spacing: .12em;
    border-color: rgba(214,184,107,.28);
}

.mystika-library-app__work-copy h2 {
    margin: .1rem 0 .4rem;
    color: var(--mystika-app-gold);
    font-size: clamp(1.45rem, 2.7vw, 2rem);
    line-height: 1.06;
    font-weight: 600;
    text-wrap: balance;
}
.mystika-library-app__work-copy h2 a { color: inherit; text-decoration: none; }

.mystika-library-app__excerpt,
.mystika-library-app__publication {
    color: var(--mystika-app-muted);
    line-height: 1.42;
    text-align: center;
}

.mystika-library-app__excerpt {
    margin: .2rem auto .3rem;
    font-size: .82rem;
    max-width: 42ch;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.mystika-library-app__publication {
    margin: .25rem 0;
    font-size: .78rem;
}

.mystika-library-app__editions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .45rem;
    margin-top: .45rem;
}

.mystika-library-app__editions a {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    border: 1px solid rgba(214,184,107,.36);
    color: var(--mystika-app-ink);
    background: rgba(214,184,107,.055);
    padding: .48rem .68rem;
    font-size: .75rem;
    text-decoration: none;
    transition: border-color 140ms ease, background 140ms ease;
}
.mystika-library-app__editions a:hover,
.mystika-library-app__editions a:focus-visible {
    border-color: var(--mystika-app-gold);
    background: rgba(214,184,107,.1);
}

.mystika-library-app__sealed {
    width: min(100%, 420px);
    margin-top: auto;
    border-top: 1px solid rgba(214,184,107,.13);
    padding-top: .68rem;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: .45rem;
    color: var(--mystika-app-muted);
    font-size: .78rem;
}

/* Compact, integrated Forziere / Rosa — never a separate banner. */
.mystika-library-app .mystika-work__secret,
.mystika-library-app .mystika-work--path .mystika-work__secret,
.mystika-library-app .mystika-work--world .mystika-work__secret {
    width: min(100%, 430px);
    min-height: 0;
    margin: auto 0 0;
    padding: .65rem .2rem 0;
    border: 0;
    border-top: 1px solid rgba(214,184,107,.13);
    background: transparent;
    box-shadow: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.mystika-library-app .mystika-key,
.mystika-library-app .mystika-rose-button,
.mystika-library-app .mystika-work--path .mystika-rose-button {
    width: auto;
    max-width: 100%;
    padding: .25rem .45rem;
}

.mystika-library-app .mystika-rose-button,
.mystika-library-app .mystika-work--path .mystika-rose-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
}

.mystika-library-app .mystika-rose,
.mystika-library-app .mystika-work--path .mystika-rose {
    width: 56px;
    flex: 0 0 56px;
}

.mystika-library-app .mystika-rose-caption,
.mystika-library-app .mystika-work--path .mystika-rose-caption {
    margin: 0;
    color: var(--mystika-app-gold);
    font-size: .68rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.mystika-library-app .mystika-rose-reveal,
.mystika-library-app .mystika-chest-reveal,
.mystika-library-app .mystika-work--path .mystika-rose-reveal {
    margin-top: .45rem;
}

.mystika-library-app .mystika-behind-path,
.mystika-library-app .mystika-chest {
    padding: .42rem .62rem;
    font-size: .7rem;
    min-width: 0;
}

.mystika-library-app .mystika-key__image-wrap {
    width: 58px;
    min-height: 44px;
}
.mystika-library-app .mystika-key__image { max-height: 54px; }
.mystika-library-app .mystika-key__word { font-size: .88rem; }
.mystika-library-app .mystika-chest__image-wrap { width: 110px; min-height: 72px; }
.mystika-library-app .mystika-chest__image { max-height: 92px; }

.mystika-library-app__empty {
    min-height: 100%;
    display: grid;
    place-items: center;
    color: var(--mystika-app-muted);
    text-align: center;
}

.mystika-library-app__status {
    min-height: 1.3em;
    margin: .65rem 0 0;
    text-align: center;
    color: var(--mystika-app-muted);
    font-size: .82rem;
}
.mystika-library-app.is-loading .mystika-library-app__status::before {
    content: "✦ ";
    color: var(--mystika-app-gold);
}

.mystika-library--reader-open .mystika-library-home-extra { display: none; }

/* ================================================================
   MOBILE — THE SAME BOOK RECOMPOSED VERTICALLY
   ================================================================ */

@media (max-width: 760px) {
    .mystika-library-app {
        width: 100%;
        --mystika-mobile-book-width: min(94vw, 520px);
    }

    .mystika-library-app__closed-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: clamp(.8rem, 4vw, 1.3rem);
        padding-inline: .35rem;
    }

    .mystika-library-app__closed-cover {
        width: min(100%, 220px);
        transform: rotateY(-5deg) rotateZ(-.35deg);
    }

    .mystika-library-app__closed-title {
        left: 14%;
        right: 7%;
        bottom: 7.5%;
        font-size: clamp(.65rem, 3.7vw, .95rem);
        letter-spacing: .035em;
    }

    .mystika-library-app__closed-copy { gap: .1rem; }
    .mystika-library-app__closed-copy strong { font-size: .88rem; }
    .mystika-library-app__closed-copy span { display: none; }

    .mystika-library-app__toolbar {
        width: var(--mystika-mobile-book-width);
        grid-template-columns: auto 1fr;
        gap: .55rem;
        margin-bottom: .45rem;
        min-height: 36px;
    }

    .mystika-library-app__close {
        min-height: 34px;
        font-size: .76rem;
        white-space: nowrap;
    }

    .mystika-library-app__universe-name {
        text-align: right;
        font-size: .84rem;
        line-height: 1.2;
    }

    .mystika-library-app__online-link {
        grid-column: 1 / -1;
        justify-self: center;
        min-height: 30px;
        padding-block: .12rem;
        font-size: .72rem;
    }

    .mystika-library-app__book-object {
        width: var(--mystika-mobile-book-width);
        perspective: 1400px;
        filter: drop-shadow(0 24px 25px rgba(0,0,0,.42));
    }

    .mystika-library-app__book-object::before {
        left: 7px;
        right: 7px;
        top: 7px;
        bottom: -8px;
        border-radius: 18px;
    }

    .mystika-library-app__open-book {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto 22px auto;
        height: auto;
        min-height: 0;
    }

    .mystika-library-app__page--right {
        grid-column: 1;
        grid-row: 1;
        border-radius: 20px 20px 7px 7px / 15px 15px 7px 7px;
        transform-origin: 50% 100%;
        background:
            radial-gradient(ellipse at 50% 13%, rgba(230,202,128,.08), transparent 38%),
            linear-gradient(180deg, #17231c 0%, #18241d 70%, #0b130f 100%);
    }

    .mystika-library-app__page--right::after {
        left: 0;
        right: 0;
        top: 0;
        bottom: auto;
        width: auto;
        height: 28px;
        background: linear-gradient(180deg, rgba(0,0,0,.21), rgba(214,184,107,.025), transparent);
    }

    .mystika-library-app__spine {
        grid-column: 1;
        grid-row: 2;
        width: auto;
        height: 22px;
        margin: -6px 8px;
        border-radius: 2% / 48%;
        background:
            linear-gradient(180deg,
                transparent 0%,
                rgba(0,0,0,.36) 15%,
                rgba(0,0,0,.72) 37%,
                rgba(214,184,107,.075) 50%,
                rgba(0,0,0,.72) 63%,
                rgba(0,0,0,.34) 85%,
                transparent 100%);
        box-shadow:
            0 -8px 18px rgba(0,0,0,.25),
            0 8px 18px rgba(0,0,0,.25);
    }

    .mystika-library-app__spine::before,
    .mystika-library-app__spine::after {
        top: 50%;
        bottom: auto;
        width: 7px;
        height: 7px;
        transform: translateY(-50%);
    }
    .mystika-library-app__spine::before { left: 7%; }
    .mystika-library-app__spine::after { left: auto; right: 7%; }

    .mystika-library-app__page--left {
        grid-column: 1;
        grid-row: 3;
        border-radius: 7px 7px 20px 20px / 7px 7px 15px 15px;
        transform-origin: 50% 0;
        background:
            linear-gradient(180deg, #0b130f 0%, #18241d 30%, #17231c 100%);
    }

    .mystika-library-app__page--left::after {
        left: 0;
        right: 0;
        top: auto;
        bottom: 0;
        width: auto;
        height: 28px;
        background: linear-gradient(0deg, rgba(0,0,0,.2), rgba(214,184,107,.025), transparent);
    }

    .mystika-library-app__reader.is-entering .mystika-library-app__page--right {
        animation-name: mystika-page-top-open;
    }
    .mystika-library-app__reader.is-entering .mystika-library-app__page--left {
        animation-name: mystika-page-bottom-open;
    }
    .mystika-library-app__reader.is-closing .mystika-library-app__page--right {
        animation-name: mystika-page-top-close;
    }
    .mystika-library-app__reader.is-closing .mystika-library-app__page--left {
        animation-name: mystika-page-bottom-close;
    }

    @keyframes mystika-page-top-open {
        from { opacity: .3; transform: rotateX(-72deg) scale(.96); }
        to { opacity: 1; transform: rotateX(0) scale(1); }
    }
    @keyframes mystika-page-bottom-open {
        from { opacity: .3; transform: rotateX(72deg) scale(.96); }
        to { opacity: 1; transform: rotateX(0) scale(1); }
    }
    @keyframes mystika-page-top-close {
        from { opacity: 1; transform: rotateX(0); }
        to { opacity: .2; transform: rotateX(-74deg) scale(.96); }
    }
    @keyframes mystika-page-bottom-close {
        from { opacity: 1; transform: rotateX(0); }
        to { opacity: .2; transform: rotateX(74deg) scale(.96); }
    }

    .mystika-library-app__display {
        padding: 1rem .95rem .9rem;
        min-height: clamp(450px, 118vw, 520px);
        max-height: none;
        overflow: visible;
    }

    .mystika-library-app__cover-link,
    .mystika-library-app__work-cover,
    .mystika-library-app__cover-placeholder {
        width: min(51vw, 190px);
        max-height: 266px;
    }
    .mystika-library-app__cover-link .mystika-library-app__work-cover { width: 100%; }

    .mystika-library-app__work-main { gap: .55rem; }
    .mystika-library-app__work-copy { width: min(100%, 360px); }
    .mystika-library-app__work-copy h2 {
        font-size: clamp(1.18rem, 6vw, 1.55rem);
        margin: .08rem 0 .28rem;
    }
    .mystika-library-app__excerpt {
        font-size: .76rem;
        line-height: 1.38;
        -webkit-line-clamp: 2;
    }
    .mystika-library-app__publication { font-size: .72rem; }
    .mystika-library-app__editions { margin-top: .3rem; }
    .mystika-library-app__editions a { padding: .4rem .55rem; font-size: .7rem; }

    .mystika-library-app .mystika-work__secret,
    .mystika-library-app .mystika-work--path .mystika-work__secret,
    .mystika-library-app .mystika-work--world .mystika-work__secret {
        margin-top: .55rem;
        padding-top: .5rem;
    }
    .mystika-library-app .mystika-rose,
    .mystika-library-app .mystika-work--path .mystika-rose { width: 48px; flex-basis: 48px; }

    .mystika-library-app__index {
        min-height: 330px;
        max-height: 440px;
        padding: 1rem .95rem 1.15rem;
        grid-template-rows: auto auto minmax(0, 1fr);
        gap: .62rem;
    }

    .mystika-library-app__group-nav { display: none; }

    .mystika-library-app__group-select-wrap {
        display: grid;
        grid-template-columns: auto minmax(0,1fr);
        align-items: center;
        gap: .65rem;
        color: rgba(214,184,107,.55);
        text-transform: uppercase;
        letter-spacing: .12em;
        font-size: .61rem;
    }

    .mystika-library-app__group-select {
        width: 100%;
        appearance: none;
        border: 0;
        border-bottom: 1px solid rgba(214,184,107,.28);
        border-radius: 0;
        background:
            linear-gradient(45deg, transparent 50%, var(--mystika-app-gold) 50%) calc(100% - 10px) 50% / 5px 5px no-repeat,
            linear-gradient(135deg, var(--mystika-app-gold) 50%, transparent 50%) calc(100% - 5px) 50% / 5px 5px no-repeat,
            transparent;
        color: var(--mystika-app-gold);
        padding: .42rem 1.2rem .42rem 0;
        font: inherit;
        font-size: .78rem;
        letter-spacing: .02em;
    }
    .mystika-library-app__group-select option { color: #131a16; background: #f0e7d1; }

    .mystika-library-app__index-heading {
        padding: .18rem 0 .6rem;
    }
    .mystika-library-app__index-heading > span { font-size: .58rem; margin-bottom: .25rem; }
    .mystika-library-app__index-heading h2 { font-size: 1.08rem; }
    .mystika-library-app__index-heading p { font-size: .72rem; }

    .mystika-library-app__work-list {
        overflow-y: auto;
        min-height: 0;
    }
    .mystika-library-app__index-item {
        grid-template-columns: 2rem minmax(0,1fr);
        padding: .67rem .2rem .63rem .05rem;
        font-size: .86rem;
    }
    .mystika-library-app__index-item small { grid-column: 2; font-size: .56rem; }
    .mystika-library-app__index-number { font-size: .65rem; }

    .mystika-library-app__status { font-size: .72rem; }
}

@media (max-width: 390px) {
    .mystika-library-app__closed-grid { gap: .7rem; }
    .mystika-library-app__closed-title { font-size: .62rem; }
    .mystika-library-app__closed-copy strong { font-size: .78rem; }

    .mystika-library-app__display {
        min-height: 430px;
        padding-inline: .78rem;
    }
    .mystika-library-app__cover-link,
    .mystika-library-app__work-cover,
    .mystika-library-app__cover-placeholder {
        width: min(50vw, 174px);
        max-height: 244px;
    }
    .mystika-library-app__index { padding-inline: .8rem; }
}

@media (prefers-reduced-motion: reduce) {
    .mystika-library-app__closed-cover,
    .mystika-library-app__page,
    .mystika-library-app__spine {
        transition: none !important;
        animation: none !important;
    }
    .mystika-library-app__closed-book.is-opening .mystika-library-app__closed-cover {
        transform: rotateY(-7deg) rotateZ(-.45deg);
    }
}

.mystika-library-app__display {
    transition: opacity 120ms ease;
}
.mystika-library-app__display.is-changing {
    opacity: .68;
}

/* ========================================================================
   v0.9.0 — Hierarchical index + object-continuity animations
   ======================================================================== */

.mystika-library-app__closed-book {
    transition: opacity 260ms ease, transform 360ms cubic-bezier(.2,.72,.2,1), filter 260ms ease;
}

.mystika-library-app.is-launching .mystika-library-app__closed-book {
    opacity: 0;
    transform: scale(.955) translateY(8px);
    filter: blur(.4px);
    pointer-events: none;
}

.mystika-library-app.is-launching .mystika-library-app__closed-book.is-opening {
    opacity: 0;
    transform: none;
}

.mystika-library-app.is-returning .mystika-library-app__closed-book {
    opacity: 0;
    transform: none;
    pointer-events: none;
}

.mystika-library-app.is-home-revealing .mystika-library-app__closed-book {
    opacity: 1;
    transform: none;
    transition-delay: 40ms;
}

.mystika-library-app__flight {
    display: block;
    box-sizing: border-box;
    border-radius: 4px 12px 12px 4px;
    transform-style: preserve-3d;
    will-change: left, top, width, height, transform, opacity, filter;
    isolation: isolate;
}

/* The left page is now a real two-level index, not a tab bar. */
.mystika-library-app__index {
    display: block;
    padding: clamp(1.45rem, 2.8vw, 2.35rem) clamp(1.45rem, 2.8vw, 2.35rem) clamp(1.35rem, 2.4vw, 2rem);
    overflow: hidden;
    perspective: 1200px;
}

.mystika-library-app__index-content {
    position: relative;
    z-index: 2;
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: .9rem;
    transform-origin: 100% 50%;
}

.mystika-library-app__index-leaf {
    position: absolute;
    z-index: 5;
    inset: 1px 0 1px 0;
    pointer-events: none;
    opacity: 0;
    transform-origin: 100% 50%;
    background:
        radial-gradient(ellipse at 25% 18%, rgba(230,202,128,.11), transparent 40%),
        linear-gradient(90deg, #111b16 0%, #19251e 68%, #0b130f 100%);
    border-right: 1px solid rgba(214,184,107,.18);
    box-shadow: -14px 0 25px rgba(0,0,0,.18);
    backface-visibility: hidden;
}

.mystika-library-app__index.is-turning-forward .mystika-library-app__index-leaf {
    animation: mystika-index-leaf-forward 430ms cubic-bezier(.28,.05,.2,1) both;
}
.mystika-library-app__index.is-turning-back .mystika-library-app__index-leaf {
    transform-origin: 0 50%;
    animation: mystika-index-leaf-back 430ms cubic-bezier(.28,.05,.2,1) both;
}
.mystika-library-app__index.is-turning-forward .mystika-library-app__index-content {
    animation: mystika-index-copy-forward 430ms ease both;
}
.mystika-library-app__index.is-turning-back .mystika-library-app__index-content {
    animation: mystika-index-copy-back 430ms ease both;
}

@keyframes mystika-index-leaf-forward {
    0% { opacity: 0; transform: rotateY(0deg); }
    12% { opacity: .88; }
    48% { opacity: .96; transform: rotateY(-88deg); box-shadow: -25px 0 35px rgba(0,0,0,.34); }
    52% { transform: rotateY(-92deg); }
    88% { opacity: .66; }
    100% { opacity: 0; transform: rotateY(-178deg); }
}
@keyframes mystika-index-leaf-back {
    0% { opacity: 0; transform: rotateY(0deg); }
    12% { opacity: .88; }
    48% { opacity: .96; transform: rotateY(88deg); box-shadow: 25px 0 35px rgba(0,0,0,.34); }
    52% { transform: rotateY(92deg); }
    88% { opacity: .66; }
    100% { opacity: 0; transform: rotateY(178deg); }
}
@keyframes mystika-index-copy-forward {
    0%, 35% { opacity: 1; transform: translateX(0); }
    49% { opacity: .16; transform: translateX(-7px); }
    51% { opacity: .16; transform: translateX(7px); }
    100% { opacity: 1; transform: translateX(0); }
}
@keyframes mystika-index-copy-back {
    0%, 35% { opacity: 1; transform: translateX(0); }
    49% { opacity: .16; transform: translateX(7px); }
    51% { opacity: .16; transform: translateX(-7px); }
    100% { opacity: 1; transform: translateX(0); }
}

.mystika-library-app__index-heading {
    padding: .05rem 0 .82rem;
    border-bottom: 1px solid rgba(214,184,107,.17);
}

.mystika-library-app__index-heading--works {
    display: grid;
    grid-template-columns: 1fr;
}

.mystika-library-app__index-back {
    appearance: none;
    justify-self: start;
    border: 0;
    border-bottom: 1px solid transparent;
    background: transparent;
    color: rgba(214,184,107,.73);
    padding: .12rem 0 .34rem;
    margin: 0 0 .4rem;
    font: inherit;
    font-size: .7rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    cursor: pointer;
    transition: color 140ms ease, border-color 140ms ease;
}
.mystika-library-app__index-back:hover,
.mystika-library-app__index-back:focus-visible {
    color: var(--mystika-app-gold);
    border-bottom-color: rgba(214,184,107,.5);
}

.mystika-library-app__group-list,
.mystika-library-app__work-list {
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: rgba(214,184,107,.25) transparent;
    overscroll-behavior: contain;
    padding-right: .18rem;
    mask-image: linear-gradient(to bottom, #000 0, #000 calc(100% - 10px), transparent 100%);
}

.mystika-library-app__group-item,
.mystika-library-app__index-item {
    appearance: none;
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: 2.8rem minmax(0, 1fr) auto;
    column-gap: .72rem;
    align-items: baseline;
    border: 0;
    border-bottom: 1px solid rgba(214,184,107,.09);
    background: transparent;
    color: var(--mystika-app-ink);
    padding: .82rem .3rem .78rem .08rem;
    text-align: left;
    font: inherit;
    line-height: 1.26;
    cursor: pointer;
    position: relative;
    transition: color 140ms ease, padding-left 140ms ease, background 140ms ease;
}

.mystika-library-app__group-item::before,
.mystika-library-app__index-item::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 0;
    height: 1px;
    background: var(--mystika-app-gold);
    transform: translateY(-50%);
    transition: width 140ms ease;
}

.mystika-library-app__group-item:hover,
.mystika-library-app__group-item:focus-visible,
.mystika-library-app__index-item:hover,
.mystika-library-app__index-item:focus-visible,
.mystika-library-app__index-item.is-active {
    color: var(--mystika-app-gold);
    padding-left: .52rem;
    background: linear-gradient(90deg, rgba(214,184,107,.055), transparent 72%);
}
.mystika-library-app__index-item.is-active::before { width: .33rem; }

.mystika-library-app__index-label {
    min-width: 0;
    overflow-wrap: anywhere;
}

.mystika-library-app__group-item small {
    color: rgba(214,184,107,.48);
    font-size: .65rem;
    font-variant-numeric: tabular-nums;
}

/* Empty right-page states intentionally read like a title page. */
.mystika-library-app__overview {
    min-height: 100%;
    width: min(100%, 430px);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: clamp(1rem, 3vw, 2rem);
    color: var(--mystika-app-muted);
}
.mystika-library-app__overview-mark {
    color: rgba(214,184,107,.44);
    font-size: clamp(2.2rem, 5vw, 3.2rem);
    line-height: 1;
    margin-bottom: 1rem;
    text-shadow: 0 0 25px rgba(214,184,107,.13);
}
.mystika-library-app__eyebrow {
    margin: 0 0 .45rem;
    color: rgba(214,184,107,.58) !important;
    text-transform: uppercase;
    letter-spacing: .2em;
    font-size: .62rem;
}
.mystika-library-app__overview h2 {
    margin: 0;
    color: var(--mystika-app-gold);
    font-size: clamp(1.55rem, 3vw, 2.2rem);
    font-weight: 600;
    line-height: 1.08;
    text-wrap: balance;
}
.mystika-library-app__overview p:not(.mystika-library-app__eyebrow) {
    margin: .8rem auto 0;
    max-width: 38ch;
    line-height: 1.52;
}
.mystika-library-app__overview small {
    margin-top: 1rem;
    color: rgba(214,184,107,.5);
    font-size: .7rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}

/* Selected work changes gently; navigation depth is expressed by page turns instead. */
.mystika-library-app__display {
    transition: opacity 180ms ease, transform 180ms ease;
}
.mystika-library-app__display.is-changing {
    opacity: .38;
    transform: translateY(5px);
}

/* Stronger open/close choreography after the travelling cover reaches centre. */
@keyframes mystika-page-left-open {
    0% { opacity: .18; transform: translateX(46%) rotateY(88deg) scale(.92); }
    45% { opacity: .72; }
    100% { opacity: 1; transform: translateX(0) rotateY(0deg) scale(1); }
}
@keyframes mystika-page-right-open {
    0% { opacity: .18; transform: translateX(-46%) rotateY(-88deg) scale(.92); }
    45% { opacity: .72; }
    100% { opacity: 1; transform: translateX(0) rotateY(0deg) scale(1); }
}
@keyframes mystika-page-left-close {
    0% { opacity: 1; transform: translateX(0) rotateY(0deg) scale(1); }
    100% { opacity: .1; transform: translateX(46%) rotateY(88deg) scale(.92); }
}
@keyframes mystika-page-right-close {
    0% { opacity: 1; transform: translateX(0) rotateY(0deg) scale(1); }
    100% { opacity: .1; transform: translateX(-46%) rotateY(-88deg) scale(.92); }
}

/* Avoid the old "home first, selected card one beat later" flash on deep restore. */
.mystika-library-app.is-restoring {
    min-height: min(54vh, 520px);
}
.mystika-library-app.is-restoring .mystika-library-app__home {
    visibility: hidden;
}

@media (max-width: 760px) {
    .mystika-library-app__index {
        min-height: 290px;
        max-height: 350px;
        padding: .82rem .88rem .95rem;
        perspective: 900px;
    }

    .mystika-library-app__index-content {
        gap: .55rem;
    }

    .mystika-library-app__index-heading {
        padding: .02rem 0 .48rem;
    }
    .mystika-library-app__index-heading > span {
        margin-bottom: .18rem;
        font-size: .54rem;
    }
    .mystika-library-app__index-heading h2 {
        font-size: 1rem;
        line-height: 1.16;
    }
    .mystika-library-app__index-heading p {
        margin-top: .32rem;
        font-size: .67rem;
        line-height: 1.32;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }
    .mystika-library-app__index-back {
        margin-bottom: .22rem;
        padding-bottom: .22rem;
        font-size: .61rem;
    }

    .mystika-library-app__group-item,
    .mystika-library-app__index-item {
        grid-template-columns: 2rem minmax(0,1fr) auto;
        column-gap: .5rem;
        padding: .57rem .14rem .54rem .04rem;
        font-size: .82rem;
        line-height: 1.2;
    }
    .mystika-library-app__group-item small { font-size: .56rem; }
    .mystika-library-app__index-item small {
        grid-column: 2 / -1;
        font-size: .52rem;
        margin-top: .05rem;
    }
    .mystika-library-app__index-number { font-size: .62rem; }

    /* Compact the cover page just enough to let more of the vertical book fit. */
    .mystika-library-app__display {
        min-height: 340px;
        max-height: 390px;
        padding: .72rem .78rem .68rem;
        overflow-y: auto;
        scroll-margin-top: 12px;
    }

    .mystika-library-app__work.mystika-work {
        min-height: 0;
    }
    .mystika-library-app__work-main { gap: .38rem; }
    .mystika-library-app__cover-link,
    .mystika-library-app__work-cover,
    .mystika-library-app__cover-placeholder {
        width: min(43vw, 160px);
        max-height: min(31vh, 224px);
    }
    .mystika-library-app__work-copy {
        width: min(100%, 330px);
    }
    .mystika-library-app .mystika-status-label,
    .mystika-library-app .mystika-work--path .mystika-status-label {
        margin: .02rem 0 .16rem;
        padding: .13rem .34rem;
        font-size: .49rem;
    }
    .mystika-library-app__work-copy h2 {
        font-size: clamp(1.02rem, 5.2vw, 1.32rem);
        margin: .02rem 0 .18rem;
        line-height: 1.08;
    }
    .mystika-library-app__excerpt {
        margin: .08rem auto .12rem;
        font-size: .69rem;
        line-height: 1.3;
        -webkit-line-clamp: 2;
    }
    .mystika-library-app__publication { margin: .12rem 0; font-size: .65rem; }
    .mystika-library-app__editions { margin-top: .18rem; gap: .3rem; }
    .mystika-library-app__editions a { padding: .32rem .45rem; font-size: .63rem; }

    .mystika-library-app .mystika-work__secret,
    .mystika-library-app .mystika-work--path .mystika-work__secret,
    .mystika-library-app .mystika-work--world .mystika-work__secret {
        margin-top: .32rem;
        padding-top: .32rem;
    }
    .mystika-library-app .mystika-rose,
    .mystika-library-app .mystika-work--path .mystika-rose {
        width: 42px;
        flex-basis: 42px;
    }
    .mystika-library-app .mystika-rose-caption,
    .mystika-library-app .mystika-work--path .mystika-rose-caption { font-size: .59rem; }

    .mystika-library-app__overview {
        min-height: 300px;
        padding: .8rem 1rem;
    }
    .mystika-library-app__overview-mark { font-size: 2rem; margin-bottom: .65rem; }
    .mystika-library-app__overview h2 { font-size: clamp(1.25rem, 6vw, 1.6rem); }
    .mystika-library-app__overview p:not(.mystika-library-app__eyebrow) { font-size: .76rem; margin-top: .55rem; }

    /* On a vertical spread the inner index leaf turns on the horizontal axis. */
    .mystika-library-app__index-leaf { transform-origin: 50% 0; }
    .mystika-library-app__index.is-turning-forward .mystika-library-app__index-leaf {
        animation-name: mystika-index-leaf-forward-mobile;
    }
    .mystika-library-app__index.is-turning-back .mystika-library-app__index-leaf {
        transform-origin: 50% 100%;
        animation-name: mystika-index-leaf-back-mobile;
    }

    @keyframes mystika-index-leaf-forward-mobile {
        0% { opacity: 0; transform: rotateX(0deg); }
        12% { opacity: .9; }
        50% { opacity: .96; transform: rotateX(90deg); box-shadow: 0 -24px 32px rgba(0,0,0,.32); }
        100% { opacity: 0; transform: rotateX(178deg); }
    }
    @keyframes mystika-index-leaf-back-mobile {
        0% { opacity: 0; transform: rotateX(0deg); }
        12% { opacity: .9; }
        50% { opacity: .96; transform: rotateX(-90deg); box-shadow: 0 24px 32px rgba(0,0,0,.32); }
        100% { opacity: 0; transform: rotateX(-178deg); }
    }

    @keyframes mystika-page-top-open {
        0% { opacity: .16; transform: translateY(42%) rotateX(-88deg) scale(.93); }
        100% { opacity: 1; transform: translateY(0) rotateX(0deg) scale(1); }
    }
    @keyframes mystika-page-bottom-open {
        0% { opacity: .16; transform: translateY(-42%) rotateX(88deg) scale(.93); }
        100% { opacity: 1; transform: translateY(0) rotateX(0deg) scale(1); }
    }
    @keyframes mystika-page-top-close {
        0% { opacity: 1; transform: translateY(0) rotateX(0deg) scale(1); }
        100% { opacity: .1; transform: translateY(42%) rotateX(-88deg) scale(.93); }
    }
    @keyframes mystika-page-bottom-close {
        0% { opacity: 1; transform: translateY(0) rotateX(0deg) scale(1); }
        100% { opacity: .1; transform: translateY(-42%) rotateX(88deg) scale(.93); }
    }
}

@media (max-width: 390px) {
    .mystika-library-app__display {
        min-height: 326px;
        max-height: 374px;
        padding-inline: .68rem;
    }
    .mystika-library-app__cover-link,
    .mystika-library-app__work-cover,
    .mystika-library-app__cover-placeholder {
        width: min(42vw, 148px);
        max-height: min(30vh, 208px);
    }
    .mystika-library-app__index {
        min-height: 278px;
        max-height: 330px;
        padding-inline: .72rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mystika-library-app__closed-book,
    .mystika-library-app__index-content,
    .mystika-library-app__index-leaf,
    .mystika-library-app__display {
        transition: none !important;
        animation: none !important;
    }
    .mystika-library-app.is-launching .mystika-library-app__closed-book,
    .mystika-library-app.is-returning .mystika-library-app__closed-book,
    .mystika-library-app.is-home-revealing .mystika-library-app__closed-book {
        opacity: 1;
        transform: none;
        filter: none;
    }
}

/* ========================================================================
   v0.9.1 — Editorial polish without changing the navigation grammar
   ======================================================================== */

/* Give the open spread a clearer physical edge without increasing its footprint. */
.mystika-library-app__book-object::after {
    content: "";
    position: absolute;
    z-index: -1;
    left: 3.2%;
    right: 3.2%;
    bottom: -15px;
    height: 18px;
    border-radius: 0 0 44% 44% / 0 0 85% 85%;
    background:
        repeating-linear-gradient(180deg,
            rgba(236,220,176,.25) 0 1px,
            rgba(74,62,42,.11) 1px 2px,
            rgba(201,181,132,.16) 2px 3px),
        linear-gradient(90deg, rgba(53,43,29,.78), rgba(134,112,72,.68) 50%, rgba(53,43,29,.78));
    box-shadow: 0 9px 15px rgba(0,0,0,.34);
    opacity: .78;
    pointer-events: none;
}

.mystika-library-app__open-book::before,
.mystika-library-app__open-book::after {
    content: "";
    position: absolute;
    z-index: 9;
    left: 2.3%;
    right: 2.3%;
    height: 4px;
    pointer-events: none;
    opacity: .54;
}
.mystika-library-app__open-book::before {
    top: 2px;
    background: linear-gradient(90deg, transparent, rgba(239,218,164,.22) 13%, rgba(239,218,164,.09) 50%, rgba(239,218,164,.22) 87%, transparent);
}
.mystika-library-app__open-book::after {
    bottom: 1px;
    background: linear-gradient(90deg, transparent, rgba(0,0,0,.24) 12%, rgba(0,0,0,.09) 50%, rgba(0,0,0,.24) 88%, transparent);
}

/* Subtle fibre/grain: the pages stay dark, but read more clearly as paper. */
.mystika-library-app__page::before {
    background-image:
        radial-gradient(circle at 18% 28%, rgba(239,221,171,.038) 0 .55px, transparent .65px),
        radial-gradient(circle at 72% 63%, rgba(0,0,0,.055) 0 .55px, transparent .7px),
        linear-gradient(115deg, transparent 0 48%, rgba(235,213,160,.025) 49% 50%, transparent 51% 100%);
    background-size: 13px 13px, 17px 17px, 100% 100%;
}

.mystika-library-app__page--left {
    box-shadow:
        inset -18px 0 28px rgba(0,0,0,.28),
        inset 7px 0 18px rgba(235,214,160,.025),
        inset 0 0 42px rgba(0,0,0,.18),
        inset 0 0 2px rgba(246,227,177,.16);
}
.mystika-library-app__page--right {
    box-shadow:
        inset 18px 0 28px rgba(0,0,0,.28),
        inset -7px 0 18px rgba(235,214,160,.025),
        inset 0 0 42px rgba(0,0,0,.18),
        inset 0 0 2px rgba(246,227,177,.16);
}

/* The gutter should look folded rather than like a separator. */
.mystika-library-app__spine {
    background:
        linear-gradient(90deg,
            transparent 0%,
            rgba(0,0,0,.32) 10%,
            rgba(0,0,0,.74) 29%,
            rgba(102,84,51,.26) 43%,
            rgba(227,200,133,.12) 49%,
            rgba(86,70,42,.23) 56%,
            rgba(0,0,0,.74) 71%,
            rgba(0,0,0,.32) 90%,
            transparent 100%);
    box-shadow:
        -13px 0 27px rgba(0,0,0,.29),
        13px 0 27px rgba(0,0,0,.29),
        inset 0 0 8px rgba(0,0,0,.36);
}

/* Closed volumes: stronger board/page separation and embossed title, still lightweight. */
.mystika-library-app__closed-cover::before {
    background:
        repeating-linear-gradient(180deg,
            rgba(238,224,188,.38) 0 1px,
            rgba(105,88,56,.13) 1px 2px,
            rgba(226,209,166,.24) 2px 4px),
        linear-gradient(90deg, #756743, #9a8960 58%, #695c3c);
}
.mystika-library-app__closed-shade {
    box-shadow:
        inset 0 0 0 1px rgba(236,208,137,.18),
        inset 0 0 0 5px rgba(4,10,7,.17),
        inset 14px 0 20px rgba(0,0,0,.24),
        inset -7px 0 14px rgba(0,0,0,.2);
}
.mystika-library-app__closed-title {
    text-shadow:
        0 1px 0 rgba(255,244,207,.52),
        0 -1px 0 rgba(63,42,14,.96),
        0 2px 0 rgba(61,42,17,.66),
        0 0 9px rgba(223,185,94,.11),
        0 7px 14px rgba(0,0,0,.74);
}

/* Index: behave like a printed contents page rather than a list of UI buttons. */
.mystika-library-app__index-heading > span,
.mystika-library-app__eyebrow {
    font-family: Georgia, "Times New Roman", serif;
}
.mystika-library-app__index-heading h2 {
    font-family: Georgia, "Times New Roman", serif;
    letter-spacing: .018em;
    text-shadow: 0 1px 12px rgba(214,184,107,.075);
}
.mystika-library-app__index-heading {
    position: relative;
}
.mystika-library-app__index-heading::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1px;
    width: min(7.5rem, 42%);
    height: 1px;
    background: linear-gradient(90deg, rgba(214,184,107,.72), rgba(214,184,107,0));
}

.mystika-library-app__group-item,
.mystika-library-app__index-item {
    border-bottom-color: rgba(214,184,107,.065);
    transition: color 135ms ease, padding-left 135ms ease, background 135ms ease, border-color 135ms ease;
}
.mystika-library-app__group-item:hover,
.mystika-library-app__group-item:focus-visible,
.mystika-library-app__index-item:hover,
.mystika-library-app__index-item:focus-visible,
.mystika-library-app__index-item.is-active {
    background: linear-gradient(90deg, rgba(214,184,107,.038), transparent 66%);
    border-bottom-color: rgba(214,184,107,.13);
}
.mystika-library-app__index-label {
    font-family: Georgia, "Times New Roman", serif;
    letter-spacing: .012em;
}
.mystika-library-app__index-number {
    color: rgba(214,184,107,.61);
    font-size: .69rem;
}
.mystika-library-app__index-item.is-active .mystika-library-app__index-number,
.mystika-library-app__index-item.is-active .mystika-library-app__index-label {
    color: var(--mystika-app-gold);
}
.mystika-library-app__index-item.is-active::before {
    width: .38rem;
    box-shadow: 0 0 8px rgba(214,184,107,.22);
}

@media (min-width: 761px) {
    .mystika-library-app__group-item .mystika-library-app__index-label,
    .mystika-library-app__index-item .mystika-library-app__index-label {
        display: flex;
        align-items: baseline;
        gap: .55rem;
    }
    .mystika-library-app__group-item .mystika-library-app__index-label::after,
    .mystika-library-app__index-item .mystika-library-app__index-label::after {
        content: "";
        flex: 1 1 auto;
        min-width: .8rem;
        border-bottom: 1px dotted rgba(214,184,107,.17);
        transform: translateY(-.2em);
    }
}

/* The temporary turning leaf gets its own paper edge and light, improving the read of the motion. */
.mystika-library-app__index-leaf {
    overflow: hidden;
    background:
        radial-gradient(ellipse at 28% 16%, rgba(238,213,153,.13), transparent 38%),
        linear-gradient(90deg, #101a15 0%, #1a271f 64%, #0a120e 100%);
}
.mystika-library-app__index-leaf::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        repeating-linear-gradient(180deg, rgba(236,218,171,.018) 0 1px, transparent 1px 5px),
        linear-gradient(90deg, transparent 0 76%, rgba(239,211,143,.09) 88%, rgba(239,211,143,.19) 98%, transparent 100%);
    opacity: .9;
}
.mystika-library-app__index-leaf::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 3px;
    background: linear-gradient(180deg, transparent, rgba(229,200,129,.48) 14%, rgba(229,200,129,.32) 84%, transparent);
    box-shadow: -5px 0 13px rgba(0,0,0,.24);
}

/* Work page: slight editorial hierarchy, no extra height. */
.mystika-library-app__work-cover,
.mystika-library-app__cover-placeholder {
    border-color: rgba(214,184,107,.25);
    box-shadow:
        0 18px 28px rgba(0,0,0,.36),
        0 2px 0 rgba(231,214,169,.08),
        0 0 0 1px rgba(0,0,0,.16);
}
.mystika-library-app__work-copy h2,
.mystika-library-app__overview h2 {
    font-family: Georgia, "Times New Roman", serif;
    letter-spacing: .008em;
}
.mystika-library-app__editions a,
.mystika-library-app .mystika-behind-path,
.mystika-library-app .mystika-chest {
    border-radius: 2px;
}

/* Clear keyboard focus without introducing permanent UI chrome. */
.mystika-library-app__closed-book:focus-visible,
.mystika-library-app__close:focus-visible,
.mystika-library-app__online-link:focus-visible,
.mystika-library-app__group-item:focus-visible,
.mystika-library-app__index-item:focus-visible,
.mystika-library-app__index-back:focus-visible,
.mystika-library-app__editions a:focus-visible {
    outline: 1px solid rgba(214,184,107,.72);
    outline-offset: 3px;
}

/* Refine mobile paper fold while preserving v0.9.0's compact dimensions. */
@media (max-width: 760px) {
    .mystika-library-app__book-object::after {
        left: 12px;
        right: 12px;
        bottom: -11px;
        height: 13px;
    }
    .mystika-library-app__open-book::before,
    .mystika-library-app__open-book::after {
        left: 10px;
        right: 10px;
    }
    .mystika-library-app__page--right {
        box-shadow:
            inset 0 -15px 24px rgba(0,0,0,.25),
            inset 0 7px 16px rgba(235,214,160,.025),
            inset 0 0 36px rgba(0,0,0,.16),
            inset 0 0 2px rgba(246,227,177,.14);
    }
    .mystika-library-app__page--left {
        box-shadow:
            inset 0 15px 24px rgba(0,0,0,.25),
            inset 0 -7px 16px rgba(235,214,160,.025),
            inset 0 0 36px rgba(0,0,0,.16),
            inset 0 0 2px rgba(246,227,177,.14);
    }
    .mystika-library-app__spine {
        background:
            linear-gradient(180deg,
                transparent 0%,
                rgba(0,0,0,.31) 11%,
                rgba(0,0,0,.72) 30%,
                rgba(214,184,107,.11) 49%,
                rgba(0,0,0,.72) 70%,
                rgba(0,0,0,.31) 89%,
                transparent 100%);
        box-shadow:
            0 -10px 21px rgba(0,0,0,.27),
            0 10px 21px rgba(0,0,0,.27),
            inset 0 0 7px rgba(0,0,0,.34);
    }
    .mystika-library-app__index-leaf::after {
        top: auto;
        left: 0;
        right: 0;
        bottom: 0;
        width: auto;
        height: 3px;
        background: linear-gradient(90deg, transparent, rgba(229,200,129,.4) 15%, rgba(229,200,129,.4) 85%, transparent);
        box-shadow: 0 -5px 13px rgba(0,0,0,.22);
    }
    .mystika-library-app__index-label {
        font-family: Georgia, "Times New Roman", serif;
        letter-spacing: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mystika-library-app__index-leaf::before,
    .mystika-library-app__index-leaf::after {
        display: none;
    }
}

/* ========================================================================
   v0.9.2 — Motion grammar: take the volume, open it in front of the reader,
   turn a real page, then put the volume back on the shelf.
   Navigation geometry remains unchanged from v0.9.1.
   ======================================================================== */

/* The shelf recedes slowly enough for the selected volume to feel extracted. */
.mystika-library-app__closed-book {
    transition:
        opacity 520ms cubic-bezier(.2,.62,.2,1),
        transform 620ms cubic-bezier(.18,.68,.18,1),
        filter 520ms ease;
}

.mystika-library-app.is-launching .mystika-library-app__closed-book {
    opacity: 0;
    transform: perspective(1200px) translateZ(-26px) scale(.94) translateY(12px);
    filter: blur(.7px) brightness(.72);
}

.mystika-library-app.is-launching .mystika-library-app__closed-book.is-opening {
    opacity: 0;
    transform: none;
    filter: none;
}

.mystika-library-app.is-returning .mystika-library-app__closed-book {
    opacity: 0;
    transform: perspective(1200px) translateZ(-20px) scale(.95) translateY(8px);
    filter: blur(.55px) brightness(.78);
}

.mystika-library-app.is-home-revealing .mystika-library-app__closed-book {
    opacity: 1;
    transform: none;
    filter: none;
    transition-delay: 0ms;
}

/* The actual spread opens only after the closed volume has arrived in front. */
.mystika-library-app__reader.is-entering .mystika-library-app__page--left,
.mystika-library-app__reader.is-entering .mystika-library-app__page--right {
    animation-duration: 1040ms;
    animation-timing-function: cubic-bezier(.36,.04,.16,1);
}

.mystika-library-app__reader.is-entering .mystika-library-app__spine {
    animation-duration: 760ms;
    animation-delay: 150ms;
    animation-timing-function: cubic-bezier(.3,.08,.18,1);
}

.mystika-library-app__reader.is-closing .mystika-library-app__page--left,
.mystika-library-app__reader.is-closing .mystika-library-app__page--right {
    animation-duration: 760ms;
    animation-timing-function: cubic-bezier(.48,.02,.7,.22);
}

.mystika-library-app__reader.is-closing .mystika-library-app__spine {
    animation-duration: 620ms;
    animation-timing-function: ease-in;
}

@keyframes mystika-page-left-open {
    0%   { opacity: .08; transform: translateX(49%) rotateY(89deg) scale(.93); filter: brightness(.66); }
    18%  { opacity: .28; transform: translateX(43%) rotateY(79deg) scale(.945); filter: brightness(.74); }
    52%  { opacity: .82; transform: translateX(22%) rotateY(43deg) scale(.975); filter: brightness(.91); }
    82%  { opacity: 1; transform: translateX(4%) rotateY(8deg) scale(.997); filter: brightness(1); }
    100% { opacity: 1; transform: translateX(0) rotateY(0deg) scale(1); filter: none; }
}

@keyframes mystika-page-right-open {
    0%   { opacity: .08; transform: translateX(-49%) rotateY(-89deg) scale(.93); filter: brightness(.66); }
    18%  { opacity: .28; transform: translateX(-43%) rotateY(-79deg) scale(.945); filter: brightness(.74); }
    52%  { opacity: .82; transform: translateX(-22%) rotateY(-43deg) scale(.975); filter: brightness(.91); }
    82%  { opacity: 1; transform: translateX(-4%) rotateY(-8deg) scale(.997); filter: brightness(1); }
    100% { opacity: 1; transform: translateX(0) rotateY(0deg) scale(1); filter: none; }
}

@keyframes mystika-page-left-close {
    0%   { opacity: 1; transform: translateX(0) rotateY(0deg) scale(1); filter: none; }
    28%  { opacity: .96; transform: translateX(6%) rotateY(12deg) scale(.995); }
    68%  { opacity: .52; transform: translateX(34%) rotateY(66deg) scale(.96); filter: brightness(.82); }
    100% { opacity: .08; transform: translateX(49%) rotateY(89deg) scale(.93); filter: brightness(.65); }
}

@keyframes mystika-page-right-close {
    0%   { opacity: 1; transform: translateX(0) rotateY(0deg) scale(1); filter: none; }
    28%  { opacity: .96; transform: translateX(-6%) rotateY(-12deg) scale(.995); }
    68%  { opacity: .52; transform: translateX(-34%) rotateY(-66deg) scale(.96); filter: brightness(.82); }
    100% { opacity: .08; transform: translateX(-49%) rotateY(-89deg) scale(.93); filter: brightness(.65); }
}

/* Text arrives after the physical pages, rather than appearing inside a closed book. */
.mystika-library-app__reader.is-entering .mystika-library-app__index-content,
.mystika-library-app__reader.is-entering .mystika-library-app__display,
.mystika-library-app__reader.is-entering .mystika-library-app__toolbar {
    animation: mystika-reader-content-arrive 1080ms cubic-bezier(.3,.06,.18,1) both;
}

.mystika-library-app__reader.is-closing .mystika-library-app__index-content,
.mystika-library-app__reader.is-closing .mystika-library-app__display,
.mystika-library-app__reader.is-closing .mystika-library-app__toolbar {
    animation: mystika-reader-content-leave 240ms ease-in both;
}

@keyframes mystika-reader-content-arrive {
    0%, 63% { opacity: 0; transform: translateY(7px); }
    82%     { opacity: .55; }
    100%    { opacity: 1; transform: translateY(0); }
}

@keyframes mystika-reader-content-leave {
    from { opacity: 1; transform: translateY(0); }
    to   { opacity: 0; transform: translateY(4px); }
}

/* A page turn is intentionally slower than a UI tab transition. */
.mystika-library-app__index.is-turning-forward,
.mystika-library-app__index.is-turning-back {
    pointer-events: none;
}

.mystika-library-app__index-leaf {
    backface-visibility: visible;
    transform-style: preserve-3d;
}

.mystika-library-app__index.is-turning-forward .mystika-library-app__index-leaf,
.mystika-library-app__index.is-turning-back .mystika-library-app__index-leaf,
.mystika-library-app__index.is-turning-forward .mystika-library-app__index-content,
.mystika-library-app__index.is-turning-back .mystika-library-app__index-content {
    animation-duration: 920ms;
}

.mystika-library-app__index.is-turning-forward .mystika-library-app__index-leaf,
.mystika-library-app__index.is-turning-back .mystika-library-app__index-leaf {
    animation-timing-function: cubic-bezier(.38,.02,.18,1);
}

.mystika-library-app__index.is-turning-forward .mystika-library-app__index-content,
.mystika-library-app__index.is-turning-back .mystika-library-app__index-content {
    animation-timing-function: cubic-bezier(.32,.08,.2,1);
}

@keyframes mystika-index-leaf-forward {
    0%   { opacity: 0; transform: rotateY(0deg) translateZ(0); filter: brightness(1); }
    7%   { opacity: .96; }
    27%  { opacity: 1; transform: rotateY(-35deg) translateZ(8px); box-shadow: -18px 0 28px rgba(0,0,0,.24); filter: brightness(1.04); }
    47%  { opacity: 1; transform: rotateY(-82deg) translateZ(12px); box-shadow: -34px 0 46px rgba(0,0,0,.42); filter: brightness(.88); }
    53%  { opacity: 1; transform: rotateY(-98deg) translateZ(12px); box-shadow: -34px 0 46px rgba(0,0,0,.42); filter: brightness(.82); }
    75%  { opacity: .96; transform: rotateY(-145deg) translateZ(6px); box-shadow: -15px 0 25px rgba(0,0,0,.26); filter: brightness(.92); }
    94%  { opacity: .72; }
    100% { opacity: 0; transform: rotateY(-180deg) translateZ(0); filter: brightness(1); }
}

@keyframes mystika-index-leaf-back {
    0%   { opacity: 0; transform: rotateY(0deg) translateZ(0); filter: brightness(1); }
    7%   { opacity: .96; }
    27%  { opacity: 1; transform: rotateY(35deg) translateZ(8px); box-shadow: 18px 0 28px rgba(0,0,0,.24); filter: brightness(1.04); }
    47%  { opacity: 1; transform: rotateY(82deg) translateZ(12px); box-shadow: 34px 0 46px rgba(0,0,0,.42); filter: brightness(.88); }
    53%  { opacity: 1; transform: rotateY(98deg) translateZ(12px); box-shadow: 34px 0 46px rgba(0,0,0,.42); filter: brightness(.82); }
    75%  { opacity: .96; transform: rotateY(145deg) translateZ(6px); box-shadow: 15px 0 25px rgba(0,0,0,.26); filter: brightness(.92); }
    94%  { opacity: .72; }
    100% { opacity: 0; transform: rotateY(180deg) translateZ(0); filter: brightness(1); }
}

@keyframes mystika-index-copy-forward {
    0%, 35% { opacity: 1; transform: translateX(0); }
    48%     { opacity: .06; transform: translateX(-10px); }
    52%     { opacity: .06; transform: translateX(10px); }
    70%     { opacity: .42; }
    100%    { opacity: 1; transform: translateX(0); }
}

@keyframes mystika-index-copy-back {
    0%, 35% { opacity: 1; transform: translateX(0); }
    48%     { opacity: .06; transform: translateX(10px); }
    52%     { opacity: .06; transform: translateX(-10px); }
    70%     { opacity: .42; }
    100%    { opacity: 1; transform: translateX(0); }
}

/* Choosing a work remains quicker than turning an index page, but no longer snaps. */
.mystika-library-app__display {
    transition: opacity 420ms cubic-bezier(.3,.08,.2,1), transform 420ms cubic-bezier(.3,.08,.2,1);
}
.mystika-library-app__display.is-changing {
    opacity: .22;
    transform: translateY(8px) scale(.993);
}

@media (max-width: 760px) {
    /* Same physical opening, re-composed along the vertical axis. */
    @keyframes mystika-page-top-open {
        0%   { opacity: .08; transform: translateY(46%) rotateX(-89deg) scale(.93); filter: brightness(.66); }
        18%  { opacity: .28; transform: translateY(39%) rotateX(-77deg) scale(.945); filter: brightness(.74); }
        52%  { opacity: .82; transform: translateY(20%) rotateX(-42deg) scale(.975); filter: brightness(.91); }
        82%  { opacity: 1; transform: translateY(3%) rotateX(-7deg) scale(.997); filter: brightness(1); }
        100% { opacity: 1; transform: translateY(0) rotateX(0deg) scale(1); filter: none; }
    }
    @keyframes mystika-page-bottom-open {
        0%   { opacity: .08; transform: translateY(-46%) rotateX(89deg) scale(.93); filter: brightness(.66); }
        18%  { opacity: .28; transform: translateY(-39%) rotateX(77deg) scale(.945); filter: brightness(.74); }
        52%  { opacity: .82; transform: translateY(-20%) rotateX(42deg) scale(.975); filter: brightness(.91); }
        82%  { opacity: 1; transform: translateY(-3%) rotateX(7deg) scale(.997); filter: brightness(1); }
        100% { opacity: 1; transform: translateY(0) rotateX(0deg) scale(1); filter: none; }
    }
    @keyframes mystika-page-top-close {
        0%   { opacity: 1; transform: translateY(0) rotateX(0deg) scale(1); filter: none; }
        30%  { opacity: .95; transform: translateY(5%) rotateX(-10deg) scale(.995); }
        70%  { opacity: .5; transform: translateY(33%) rotateX(-66deg) scale(.96); filter: brightness(.8); }
        100% { opacity: .08; transform: translateY(46%) rotateX(-89deg) scale(.93); filter: brightness(.64); }
    }
    @keyframes mystika-page-bottom-close {
        0%   { opacity: 1; transform: translateY(0) rotateX(0deg) scale(1); filter: none; }
        30%  { opacity: .95; transform: translateY(-5%) rotateX(10deg) scale(.995); }
        70%  { opacity: .5; transform: translateY(-33%) rotateX(66deg) scale(.96); filter: brightness(.8); }
        100% { opacity: .08; transform: translateY(-46%) rotateX(89deg) scale(.93); filter: brightness(.64); }
    }

    @keyframes mystika-index-leaf-forward-mobile {
        0%   { opacity: 0; transform: rotateX(0deg) translateZ(0); filter: brightness(1); }
        7%   { opacity: .96; }
        28%  { opacity: 1; transform: rotateX(34deg) translateZ(7px); box-shadow: 0 -18px 28px rgba(0,0,0,.24); filter: brightness(1.04); }
        48%  { opacity: 1; transform: rotateX(84deg) translateZ(11px); box-shadow: 0 -32px 43px rgba(0,0,0,.4); filter: brightness(.87); }
        52%  { opacity: 1; transform: rotateX(96deg) translateZ(11px); box-shadow: 0 -32px 43px rgba(0,0,0,.4); filter: brightness(.82); }
        76%  { opacity: .95; transform: rotateX(146deg) translateZ(5px); box-shadow: 0 -14px 24px rgba(0,0,0,.25); filter: brightness(.93); }
        100% { opacity: 0; transform: rotateX(180deg) translateZ(0); filter: brightness(1); }
    }
    @keyframes mystika-index-leaf-back-mobile {
        0%   { opacity: 0; transform: rotateX(0deg) translateZ(0); filter: brightness(1); }
        7%   { opacity: .96; }
        28%  { opacity: 1; transform: rotateX(-34deg) translateZ(7px); box-shadow: 0 18px 28px rgba(0,0,0,.24); filter: brightness(1.04); }
        48%  { opacity: 1; transform: rotateX(-84deg) translateZ(11px); box-shadow: 0 32px 43px rgba(0,0,0,.4); filter: brightness(.87); }
        52%  { opacity: 1; transform: rotateX(-96deg) translateZ(11px); box-shadow: 0 32px 43px rgba(0,0,0,.4); filter: brightness(.82); }
        76%  { opacity: .95; transform: rotateX(-146deg) translateZ(5px); box-shadow: 0 14px 24px rgba(0,0,0,.25); filter: brightness(.93); }
        100% { opacity: 0; transform: rotateX(-180deg) translateZ(0); filter: brightness(1); }
    }
}

@media (prefers-reduced-motion: reduce) {
    .mystika-library-app__reader.is-entering .mystika-library-app__index-content,
    .mystika-library-app__reader.is-entering .mystika-library-app__display,
    .mystika-library-app__reader.is-entering .mystika-library-app__toolbar,
    .mystika-library-app__reader.is-closing .mystika-library-app__index-content,
    .mystika-library-app__reader.is-closing .mystika-library-app__display,
    .mystika-library-app__reader.is-closing .mystika-library-app__toolbar {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}

/* ================================================================
   v0.9.3 — Revealed panels must visibly announce themselves
   ================================================================ */
.mystika-library-app .mystika-chest-reveal,
.mystika-library-app .mystika-rose-reveal {
    scroll-margin-top: clamp(72px, 10vh, 112px);
    border-radius: 12px;
}

.mystika-library-app .mystika-chest-reveal.mystika-reveal-attention,
.mystika-library-app .mystika-rose-reveal.mystika-reveal-attention {
    animation: mystika-reveal-attention 1.55s cubic-bezier(.22,.72,.22,1) both;
}

@keyframes mystika-reveal-attention {
    0% {
        background: rgba(214,184,107,0);
        box-shadow: 0 0 0 0 rgba(214,184,107,0), 0 0 0 rgba(214,184,107,0);
    }
    18% {
        background: rgba(214,184,107,.09);
        box-shadow: 0 0 0 1px rgba(214,184,107,.42), 0 0 30px rgba(214,184,107,.20);
    }
    48% {
        background: rgba(214,184,107,.045);
        box-shadow: 0 0 0 1px rgba(214,184,107,.23), 0 0 18px rgba(214,184,107,.10);
    }
    100% {
        background: rgba(214,184,107,0);
        box-shadow: 0 0 0 0 rgba(214,184,107,0), 0 0 0 rgba(214,184,107,0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .mystika-library-app .mystika-chest-reveal.mystika-reveal-attention,
    .mystika-library-app .mystika-rose-reveal.mystika-reveal-attention {
        animation-duration: .3s;
    }
}
