:root {
    color-scheme: light;
    font-family: Georgia, "Times New Roman", serif;
    color: #28251f;
    background: #f3efe7;
}

* { box-sizing: border-box; }

body { margin: 0; min-height: 100vh; }

.has-pdf-reader {
    overflow: hidden;
    background: #fcfcfc;
}

.has-pdf-reader .site-header { display: none; }

.has-pdf-reader main {
    width: 100%;
    height: 100vh;
    height: 100dvh;
    margin: 0;
}

.site-header {
    padding: .5rem .5rem;
    background: #292720;
    color: #fffaf0;
}

.site-header h3 {
    max-width: 1000px;
    margin: 0 auto;
    font-size: 1.5rem;
}

main {
    width: min(100%, calc(100% - 2rem));
    margin: 2rem auto;
}

.book-picker {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .75rem;
    margin-bottom: 1.25rem;
    font-family: Arial, sans-serif;
}

.book-picker a {
    padding: .55rem .85rem;
    border: 1px solid #c9c0b1;
    border-radius: 999px;
    color: #494337;
    text-decoration: none;
}

.book-picker a[aria-current="page"] {
    border-color: #754d2c;
    background: #754d2c;
    color: white;
}

.book-title { margin: 0 0 .3rem; text-align: center; }
.book-heading { margin: 0 0 .5rem; text-align: center; }
.book-author { margin: 0 0 1.5rem; color: #716b60; text-align: center; }

.book-details {
    margin: 0 0 1.5rem;
    color: #625b50;
    font-family: Arial, sans-serif;
    text-align: center;
}

.book-details p { margin: .5rem 0; }
.book-details code { overflow-wrap: anywhere; }

.pdf-reader {
    position: relative;
    width: 100%;
    height: 100%;
    font-family: Arial, sans-serif;
}

.pdf-stage {
    position: absolute;
    inset: 0;
    display: grid;
    min-height: 0;
    place-items: center;
    overflow: auto;
    padding: 3.5rem 1rem;
    background: #fcfcfc;
    perspective: 2200px;
}

.pdf-reader:fullscreen {
    display: block;
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    margin: 0;
    padding: 0;
    background: #fcfcfc;
}

.pdf-reader:fullscreen .pdf-stage {
    position: absolute;
    inset: 0;
    min-height: 0;
    width: 100%;
    padding: 3.5rem 1rem;
}

.pdf-page-stack {
    position: relative;
    width: min(100%, 1040px);
    aspect-ratio: 1.55 / 1;
    background: #fffdf8;
    box-shadow:
        0 5px 18px #392d1d30,
        0 0 0 1px #d4cabb,
        0 2px 0 #eee8dc,
        0 4px 0 #d7cdbd,
        0 6px 1px #b6aa98;
    transform-style: preserve-3d;
    transition: transform .2s ease-out;
}

.pdf-page-stack::after {
    position: absolute;
    z-index: 3;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 24px;
    background: linear-gradient(90deg, #00000016, #00000003 42%, #fff9 50%, #00000008 65%, transparent);
    content: "";
    pointer-events: none;
    transform: translateX(-50%);
}

.pdf-page-stack.is-cover::after { display: none; }

.pdf-page-stack canvas {
    position: absolute;
    display: block;
    top: 0;
    width: 50%;
    height: 100%;
    background: #fffdf8;
}

.pdf-page-stack.is-cover #pdf-left-page { display: none; }
.pdf-page-stack.is-cover {
    left: -25%;
    background: transparent;
    box-shadow: none;
}
.pdf-page-stack.is-cover #pdf-right-page {
    left: auto;
    right: 0;
    width: 50%;
    box-shadow: 0 5px 18px #392d1d30, 0 0 0 1px #d4cabb;
}

.pdf-page-turn {
    position: absolute;
    z-index: 2;
    top: 0;
    right: 0;
    width: 50%;
    height: 100%;
    visibility: hidden;
    transform-style: preserve-3d;
    transform-origin: left center;
}

.pdf-page-turn.is-turning-forward {
    visibility: visible;
    filter: drop-shadow(0 5px 5px #3027192e);
    animation: turn-page-forward .85s cubic-bezier(.45, .05, .55, .95) forwards;
}

.pdf-page-turn.is-turning-backward {
    right: auto;
    left: 0;
    transform-origin: right center;
    visibility: visible;
    filter: drop-shadow(0 5px 5px #3027192e);
    animation: turn-page-backward .85s cubic-bezier(.45, .05, .55, .95) forwards;
}

.pdf-page-turn.is-dragging-forward,
.pdf-page-turn.is-dragging-backward {
    visibility: visible;
    animation: none;
    transition: none;
    filter:
        drop-shadow(calc(var(--turn-depth, 0px) * -.45) 0 calc(var(--turn-depth, 0px) * .7) #30271955)
        drop-shadow(0 2px 2px #30271926);
}

.pdf-page-turn.is-dragging-forward { transform-origin: left center; }
.pdf-page-turn.is-dragging-backward {
    right: auto;
    left: 0;
    transform-origin: right center;
}

.pdf-page-turn::before,
.pdf-page-turn::after {
    position: absolute;
    z-index: 2;
    inset: 0;
    content: "";
    pointer-events: none;
    opacity: 0;
    backface-visibility: hidden;
}

.pdf-page-turn::before {
    background:
        radial-gradient(ellipse at 100% 50%, #30271938 0, #3027191c 27%, transparent 67%),
        linear-gradient(90deg, transparent 42%, #30271900 55%, #30271938 84%, #fff9 97%, #30271912);
    mix-blend-mode: multiply;
}

.pdf-page-turn::after {
    inset: 0 0 0 auto;
    width: 28%;
    background:
        radial-gradient(ellipse at 100% 50%, #fff 0, #fff9 18%, #30271920 55%, transparent 76%),
        linear-gradient(90deg, transparent, #30271912 45%, #fff9 82%, #30271922);
    transform: scaleX(var(--turn-progress, 0));
    transform-origin: right center;
}

.pdf-page-turn.is-dragging-forward::before,
.pdf-page-turn.is-dragging-forward::after {
    opacity: calc(var(--turn-progress, 0) * .82);
}

.pdf-page-turn.is-dragging-backward::before,
.pdf-page-turn.is-dragging-backward::after {
    opacity: calc(var(--turn-progress, 0) * .82);
}

.pdf-page-turn.is-dragging-backward::before {
    background:
        radial-gradient(ellipse at 0 50%, #30271938 0, #3027191c 27%, transparent 67%),
        linear-gradient(270deg, transparent 42%, #30271900 55%, #30271938 84%, #fff9 97%, #30271912);
}

.pdf-page-turn.is-dragging-backward::after {
    inset: 0 auto 0 0;
    background:
        radial-gradient(ellipse at 0 50%, #fff 0, #fff9 18%, #30271920 55%, transparent 76%),
        linear-gradient(270deg, transparent, #30271912 45%, #fff9 82%, #30271922);
    transform-origin: left center;
}

.pdf-page-turn.is-turning-forward::before,
.pdf-page-turn.is-turning-forward::after {
    animation: turn-shading-forward .85s ease-in-out both;
}

.pdf-page-turn.is-turning-backward::before {
    background:
        radial-gradient(ellipse at 0 50%, #30271938 0, #3027191c 27%, transparent 67%),
        linear-gradient(270deg, transparent 42%, #30271900 55%, #30271938 84%, #fff9 97%, #30271912);
}

.pdf-page-turn.is-turning-backward::after {
    inset: 0 auto 0 0;
    background:
        radial-gradient(ellipse at 0 50%, #fff 0, #fff9 18%, #30271920 55%, transparent 76%),
        linear-gradient(270deg, transparent, #30271912 45%, #fff9 82%, #30271922);
    transform-origin: left center;
}

.pdf-page-turn.is-turning-backward::before,
.pdf-page-turn.is-turning-backward::after {
    animation: turn-shading-backward .85s ease-in-out both;
}

.pdf-page-turn.is-turning-forward::after,
.pdf-page-turn.is-turning-backward::after {
    transform: scaleX(1);
}

.pdf-page-turn canvas {
    position: absolute;
    display: block;
    inset: 0;
    width: 100%;
    height: 100%;
    background: #fffdf8;
    backface-visibility: hidden;
    -webkit-user-drag: none;
    user-select: none;
}

.pdf-page-turn-front {
    box-shadow: inset -12px 0 18px -14px #302719;
}

.pdf-page-turn-back {
    transform: rotateY(180deg);
    box-shadow: inset 12px 0 18px -14px #302719;
}

.pdf-drag-corner {
    position: absolute;
    z-index: 4;
    width: clamp(42px, 9vw, 76px);
    height: clamp(42px, 9vw, 76px);
    touch-action: none;
    cursor: grab;
}

.pdf-drag-corner:active { cursor: grabbing; }
.pdf-drag-corner-top { top: 0; }
.pdf-drag-corner-bottom { bottom: 0; }
.pdf-drag-corner-next { right: 0; }
.pdf-drag-corner-previous { left: 0; }
.pdf-page-stack.is-cover .pdf-drag-corner-previous { display: none; }

#pdf-left-page {
    left: 0;
    box-shadow: inset -8px 0 14px -14px #302719;
    -webkit-user-drag: none;
    user-select: none;
}

#pdf-right-page {
    right: 0;
    box-shadow: inset 8px 0 14px -14px #302719;
    -webkit-user-drag: none;
    user-select: none;
}

.pdf-side-button {
    position: absolute;
    z-index: 5;
    top: 50%;
    display: grid;
    width: 2.25rem;
    height: 3.25rem;
    place-items: center;
    padding: 0;
    border-radius: 5px;
    background: #fff9;
    color: #5e5a52;
    font: 2rem/1 Arial, sans-serif;
    transform: translateY(-50%);
}

.pdf-side-button:hover:not(:disabled) { background: white; }
.pdf-side-button:disabled { opacity: .45; }
.pdf-side-prev { left: .5rem; }
.pdf-side-next { right: .5rem; }

.pdf-controls {
    position: absolute;
    z-index: 6;
    bottom: .65rem;
    left: 50%;
    gap: .65rem;
    margin: 0;
    padding: .3rem .5rem;
    border-radius: 6px;
    background: #ffffffdf;
    box-shadow: 0 1px 5px #0002;
    transform: translateX(-50%);
}

.pdf-status {
    position: absolute;
    bottom: 3.4rem;
    left: 50%;
    min-height: 0;
    margin: 0;
    color: #625b50;
    text-align: center;
    transform: translateX(-50%);
}

.pdf-status:empty { display: none; }

.pdf-zoom-controls {
    position: absolute;
    z-index: 6;
    top: .5rem;
    right: .65rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    margin: 0;
    padding: .35rem;
    border-radius: 6px;
    background: #ffffffdf;
    box-shadow: 0 1px 5px #0002;
    font-family: Arial, sans-serif;
}

@media (max-width: 560px) {
    .pdf-stage { padding: 3.75rem .5rem 3.5rem; }

    .pdf-zoom-controls {
        right: .4rem;
        left: .4rem;
        flex-wrap: wrap;
        gap: .3rem;
        padding: .3rem;
    }

    .pdf-zoom-controls button { min-width: 2.25rem; padding: .45rem .55rem; }
    .pdf-download { padding: .45rem .55rem; }

    .pdf-controls {
        bottom: .4rem;
        gap: .5rem;
    }
}

.pdf-zoom-controls button {
    min-width: 2.5rem;
    padding: .5rem .75rem;
    font-size: 1rem;
}

.pdf-download {
    padding: .5rem .75rem;
    border-radius: 6px;
    background: #754d2c;
    color: white;
    font-size: .9rem;
    text-decoration: none;
}

.pdf-page-stack canvas { cursor: zoom-in; }
.pdf-page-stack.is-zoomed canvas {
    cursor: grab;
    touch-action: none;
}
.pdf-page-stack.is-panning canvas { cursor: grabbing; }

#pdf-zoom-level {
    min-width: 3.5rem;
    color: #625b50;
    text-align: center;
    font-size: .9rem;
}

.book {
    position: relative;
    display: grid;
    min-height: 390px;
    place-items: center;
    overflow: hidden;
    padding: clamp(1.5rem, 6vw, 4rem);
    border: 1px solid #d6cbb9;
    border-radius: 8px 18px 18px 8px;
    background: linear-gradient(90deg, #e5dccd 0, #fffdf8 2%, #fffdf8 97%, #e9e0d3 100%);
    box-shadow: 0 18px 45px #392d1d22, inset 12px 0 18px #392d1d0d;
    text-align: center;
}

.book::before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 2.4rem;
    border-left: 1px solid #ece5d9;
    content: "";
}

.page {
    display: none;
    width: min(100%, 610px);
    animation: turn-in .28s ease-out;
}

.page.is-active { display: block; }
.page h3 { margin: 0 0 1.2rem; font-size: clamp(1.5rem, 4vw, 2rem); }
.page-copy { white-space: pre-line; line-height: 1.85; }

.controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-top: 1.25rem;
    font-family: Arial, sans-serif;
}

button {
    padding: .65rem 1rem;
    border: 0;
    border-radius: 6px;
    background: #754d2c;
    color: white;
    cursor: pointer;
}

button:disabled { background: #b8ae9f; cursor: not-allowed; }
#page-count { min-width: 6rem; color: #625b50; text-align: center; }
.notice { padding: 2rem; border-radius: 8px; background: #fffdf8; text-align: center; }

.admin-main {
    width: min(100% - 2rem, 760px);
    margin: 3rem auto;
    font-family: Arial, sans-serif;
}

.admin-card {
    padding: 2rem;
    border: 1px solid #ded6c9;
    border-radius: 10px;
    background: #fffdf8;
    box-shadow: 0 12px 36px rgb(41 39 32 / 8%);
}

.admin-card h1 { margin-top: 0; }
.admin-card label { display: block; margin: 1rem 0 .4rem; font-weight: 700; }
.admin-card input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]) {
    width: 100%;
    padding: .75rem;
    border: 1px solid #bfb5a6;
    border-radius: 5px;
    font: inherit;
}

.admin-card button {
    margin-top: 1.25rem;
    padding: .7rem 1rem;
    border: 0;
    border-radius: 5px;
    background: #754d2c;
    color: #fff;
    font: inherit;
    cursor: pointer;
}

.admin-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.admin-heading h1 { margin-bottom: 0; }
.admin-heading button { margin-top: 0; }
.admin-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem; }
.admin-actions form { margin: 0; }
.admin-actions button { margin: 0; }
.admin-button {
    display: inline-block;
    padding: .65rem .9rem;
    border-radius: 5px;
    background: #754d2c;
    color: #fff;
    text-decoration: none;
}
.admin-button-danger, .admin-danger-button { background: #a12622 !important; }
.admin-error { color: #a12622; }
.admin-book-list { padding-left: 1.25rem; }
.admin-book-list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin: 1rem 0;
    padding: 1rem 0;
    border-bottom: 1px solid #ded6c9;
}
.admin-book-details { min-width: 0; }
.admin-book-list span { display: block; margin-top: .25rem; color: #625b50; overflow-wrap: anywhere; }
.admin-current-pdf { color: #625b50; overflow-wrap: anywhere; }
.admin-delete-switch { margin: 1rem 0 1.5rem; }

.admin-app {
    min-height: 100vh;
    background: #f5f6f8;
    font-family: Arial, sans-serif;
}

.admin-shell { min-height: 100vh; }
.admin-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 1020;
    display: flex;
    width: 260px;
    flex-direction: column;
    padding: 1.25rem 1rem;
    background: #292720;
    color: #fffaf0;
}

.admin-brand {
    margin-bottom: 1.5rem;
    color: #fffaf0;
    font-size: 1.25rem;
    font-weight: 700;
    text-decoration: none;
}

.admin-account {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: 1.5rem;
    overflow-wrap: anywhere;
}

.admin-sidebar .nav-link { color: #f2e9dc; }
.admin-sidebar .nav-link:hover { background: rgb(255 255 255 / 10%); }
.admin-sidebar .nav-link.active { background: #754d2c; color: #fff; }
.admin-sidebar-logout { margin-top: auto; }
.admin-content {
    width: auto;
    min-width: 0;
    min-height: 100vh;
    margin: 0 0 0 260px;
    overflow-x: clip;
}
.admin-content .container { max-width: 1000px; }
.admin-content .admin-card { max-width: 760px; margin: 0 auto; }
.admin-card .form-check-label { display: inline-block; margin: 0; font-weight: 400; }

.ebook-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 88px;
    align-items: center;
    gap: .75rem;
    min-width: 0;
    padding: .7rem 1rem;
}

.ebook-row-details { min-width: 0; }
.ebook-row-details h2 { overflow-wrap: anywhere; }
.ebook-row-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem 1rem;
    color: #6c757d;
    font-size: .8125rem;
}

.ebook-row-meta span { overflow-wrap: anywhere; }
.ebook-row-actions { display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: .4rem; }
.ebook-row-qr {
    display: flex;
    justify-content: flex-end;
    min-width: 0;
}
.ebook-row-qr img,
.ebook-row-qr canvas { display: block; max-width: 100%; height: auto; }

@media (max-width: 560px) {
    .admin-book-list li { align-items: flex-start; flex-direction: column; }
    .admin-heading { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 767.98px) {
    .admin-sidebar {
        position: static;
        width: 100%;
        min-height: auto;
        gap: .5rem;
        padding: .75rem 1rem;
    }
    .admin-brand { margin: 0; }
    .admin-account { justify-content: flex-start; margin: 0; }
    .admin-sidebar .nav { flex-direction: row !important; overflow-x: auto; }
    .admin-sidebar .nav-link { flex: 0 0 auto; }
    .admin-sidebar-logout { margin: 0; }
    .admin-sidebar-logout .btn { width: auto !important; padding: .35rem .7rem; }
    .admin-content { margin-left: 0; }
    .admin-content .container-fluid { padding-top: 1rem !important; }
    .ebook-row { grid-template-columns: minmax(0, 1fr) 84px; align-items: center; gap: .6rem; }
    .ebook-row-details { grid-column: 1; grid-row: 1; }
    .ebook-row-actions { grid-column: 1; grid-row: 2; width: 100%; }
    .ebook-row-qr { grid-column: 2; grid-row: 1 / span 2; }
}

@media (max-width: 420px) {
    .admin-sidebar { padding-inline: .75rem; }
    .admin-content .container-fluid { padding-inline: .75rem !important; }
    .ebook-row { grid-template-columns: minmax(0, 1fr) 72px; padding: .7rem .75rem; }
    .ebook-row-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ebook-row-actions .btn { width: 100%; }
}

@keyframes turn-in {
    from { opacity: .3; transform: rotateY(-8deg); }
    to { opacity: 1; transform: rotateY(0); }
}

@keyframes turn-page-forward {
    0% { transform: rotateY(0) translateZ(0); }
    32% { transform: rotateY(-62deg) translateZ(30px) scaleX(.98) skewY(-1deg); }
    68% { transform: rotateY(-132deg) translateZ(24px) scaleX(.96) skewY(1deg); }
    100% { transform: rotateY(-180deg) translateZ(0); }
}

@keyframes turn-page-backward {
    0% { transform: rotateY(0) translateZ(0); }
    32% { transform: rotateY(62deg) translateZ(30px) scaleX(.98) skewY(1deg); }
    68% { transform: rotateY(132deg) translateZ(24px) scaleX(.96) skewY(-1deg); }
    100% { transform: rotateY(180deg) translateZ(0); }
}

@keyframes turn-shading-forward {
    0%, 100% { opacity: 0; }
    38%, 70% { opacity: .88; }
}

@keyframes turn-shading-backward {
    0%, 100% { opacity: 0; }
    38%, 70% { opacity: .88; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; }
}

.ppms-home {
    background: #fffefa;
    color: #17333e;
    font-family: Arial, sans-serif;
}

.ppms-navbar {
    position: relative;
    z-index: 2;
    min-height: 82px;
    background: #fffefa;
}

.ppms-brand {
    display: inline-flex;
    align-items: center;
    gap: .7rem;
    color: #17333e;
    white-space: nowrap;
}

.ppms-brand:hover { color: #17333e; }
.ppms-brand > span:last-child { display: grid; gap: .1rem; }
.ppms-brand strong { font-size: 1.12rem; letter-spacing: .08em; }
.ppms-brand small { color: #758184; font-size: .64rem; letter-spacing: .035em; }

.ppms-brand-mark,
.ppms-credit-mark {
    display: grid;
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 50%;
    background: #e7b55c;
    color: #17333e;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.5rem;
    font-weight: 700;
}

.ppms-navbar .nav-link {
    color: #4a5b5e;
    font-size: .9rem;
}

.ppms-navbar .nav-link:hover { color: #b16f31; }
.ppms-login-btn,
.ppms-primary-btn {
    border: 1px solid #d58e43;
    border-radius: 3px;
    background: #d58e43;
    color: #fff;
    font-size: .9rem;
    font-weight: 700;
    padding: .75rem 1.2rem;
}

.ppms-login-btn:hover,
.ppms-primary-btn:hover {
    border-color: #b97936;
    background: #b97936;
    color: #fff;
}

.ppms-main { width: 100%; margin: 0; }

.ppms-hero {
    position: relative;
    overflow: hidden;
    padding: clamp(4rem, 8vw, 7rem) 0 clamp(4rem, 7vw, 6rem);
    background:
        radial-gradient(ellipse at 87% 47%, rgb(223 187 125 / 17%), transparent 34%),
        linear-gradient(115deg, #f7f2e7 0%, #fcf9f1 57%, #f0eee5 100%);
}

.ppms-eyebrow,
.ppms-section-label {
    color: #ac7138;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .17em;
}

.ppms-eyebrow {
    display: flex;
    align-items: center;
    gap: .65rem;
    margin-bottom: 1.3rem;
}

.ppms-eyebrow span {
    width: 25px;
    height: 1px;
    background: #c88d4b;
}

.ppms-hero h1 {
    margin: 0;
    color: #17333e;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2.75rem, 6vw, 5.2rem);
    font-weight: 400;
    letter-spacing: -.045em;
    line-height: 1.04;
}

.ppms-hero h1 em {
    color: #b9783e;
    font-weight: 400;
}

.ppms-hero-copy {
    max-width: 490px;
    margin: 1.4rem 0 0;
    color: #667477;
    font-size: 1.05rem;
    line-height: 1.8;
}

.ppms-text-link,
.ppms-about-link {
    color: #17333e;
    font-size: .9rem;
    font-weight: 700;
    text-decoration: none;
}

.ppms-text-link:hover,
.ppms-about-link:hover { color: #b16f31; }
.ppms-text-link span,
.ppms-about-link span { margin-left: .25rem; }

.ppms-hero-note {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin-top: 2.5rem;
    color: #758184;
    font-size: .78rem;
    letter-spacing: .04em;
}

.ppms-note-icon { color: #c68d4c; font-size: 1rem; }

.ppms-hero-art {
    position: relative;
    display: grid;
    min-height: 390px;
    place-items: center;
}

.ppms-art-orbit {
    position: absolute;
    width: 330px;
    height: 330px;
    border: 1px solid rgb(174 129 74 / 18%);
    border-radius: 50%;
}

.ppms-art-orbit-one { transform: rotate(-25deg) scaleX(1.12); }
.ppms-art-orbit-two { width: 270px; height: 360px; transform: rotate(37deg); }

.ppms-art-book {
    position: absolute;
    width: min(245px, 60vw);
    height: 325px;
    border-radius: 3px 12px 12px 3px;
}

.ppms-art-book-back {
    margin: 22px 0 0 34px;
    background: #c28a4f;
    box-shadow: 12px 12px 32px rgb(39 48 41 / 13%);
    transform: rotate(8deg);
}

.ppms-art-book-front {
    display: flex;
    flex-direction: column;
    padding: 2rem 1.65rem;
    background:
        linear-gradient(145deg, transparent 53%, rgb(255 255 255 / 6%) 53%),
        #1c414a;
    box-shadow: 8px 16px 38px rgb(39 48 41 / 24%), inset 7px 0 0 rgb(0 0 0 / 12%);
    color: #fbf2df;
    transform: rotate(-5deg);
}

.ppms-book-kicker,
.ppms-book-foot { font-size: .55rem; letter-spacing: .18em; }
.ppms-book-title {
    margin: auto 0;
    color: #f0c477;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 2.65rem;
    line-height: 1.05;
}

.ppms-book-line { width: 42px; height: 2px; margin-bottom: 1rem; background: #dcaa5b; }
.ppms-book-foot { color: #d7d1bd; }
.ppms-art-spark { position: absolute; color: #bd8749; }
.ppms-spark-one { top: 12%; right: 10%; font-size: 1.7rem; }
.ppms-spark-two { bottom: 16%; left: 8%; font-size: 1.2rem; }

.ppms-publications { background: #fffefa; }

.ppms-section-label { margin-bottom: .5rem; }

.ppms-section-title {
    color: #17333e;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 400;
    letter-spacing: -.035em;
}

.ppms-section-caption { color: #778285; font-size: .9rem; }

.ppms-book-card {
    height: 100%;
    padding: 1rem;
    border: 1px solid #eeeae1;
    background: #fff;
    transition: transform .2s ease, box-shadow .2s ease;
}

.ppms-book-card:hover {
    box-shadow: 0 14px 32px rgb(29 46 48 / 9%);
    transform: translateY(-4px);
}

.ppms-cover-link { display: block; color: inherit; text-decoration: none; }

.ppms-card-cover {
    position: relative;
    display: flex;
    min-height: 285px;
    flex-direction: column;
    overflow: hidden;
    padding: 1.35rem 1.4rem;
    background: #294c50;
    color: #fff8e8;
    isolation: isolate;
}

.ppms-card-cover::before,
.ppms-card-cover::after {
    position: absolute;
    z-index: -1;
    border: 1px solid rgb(255 255 255 / 22%);
    border-radius: 50%;
    content: "";
}

.ppms-card-cover::before { top: 17%; right: -22%; width: 225px; height: 225px; }
.ppms-card-cover::after { top: 24%; right: -12%; width: 185px; height: 185px; }
.ppms-cover-1 { background: #a65d42; }
.ppms-cover-2 { background: #394a6b; }
.ppms-cover-brand { font-size: .56rem; font-weight: 700; letter-spacing: .12em; }
.ppms-cover-brand span { color: rgb(255 248 232 / 68%); font-weight: 400; }
.ppms-cover-art {
    position: absolute;
    top: 30%;
    right: 18%;
    display: flex;
    align-items: flex-end;
    gap: 7px;
    height: 83px;
    opacity: .68;
    transform: rotate(17deg);
}

.ppms-cover-art i { display: block; width: 18px; border: 1px solid #f4dcae; border-radius: 50% 50% 0 0; }
.ppms-cover-art i:nth-child(1) { height: 47px; }
.ppms-cover-art i:nth-child(2) { height: 78px; }
.ppms-cover-art i:nth-child(3) { height: 59px; }
.ppms-cover-title {
    max-width: 90%;
    margin-top: auto;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(1.7rem, 3vw, 2.2rem);
    line-height: 1.1;
    overflow-wrap: anywhere;
}

.ppms-cover-author { margin-top: .8rem; color: rgb(255 248 232 / 78%); font-size: .73rem; }
.ppms-cover-number { position: absolute; right: 1.4rem; bottom: 1.3rem; font-family: Georgia, "Times New Roman", serif; font-size: .8rem; }

.ppms-card-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .7rem;
    padding: 1.2rem .2rem .25rem;
}

.ppms-card-info h3 {
    margin: 0;
    color: #17333e;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.2rem;
    font-weight: 400;
}

.ppms-card-info p { margin: .35rem 0 0; color: #788487; font-size: .8rem; }
.ppms-read-link {
    display: grid;
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid #e4ded2;
    border-radius: 50%;
    color: #17333e;
    font-size: 1.1rem;
    text-decoration: none;
}

.ppms-read-link:hover { border-color: #d58e43; background: #d58e43; color: #fff; }

.ppms-empty-shelf {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.5rem;
    border: 1px solid #eeeae1;
    color: #667477;
}

.ppms-empty-shelf > span { color: #bd8749; font-size: 1.4rem; }

.ppms-about {
    background: #f4f0e6;
}

.ppms-about .ppms-section-title span { color: #b9783e; }
.ppms-about-copy { margin: 0 0 1.2rem; color: #667477; line-height: 1.8; }

.ppms-project-credit {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 3.5rem;
    padding-top: 1.7rem;
    border-top: 1px solid #dfd8ca;
}

.ppms-credit-mark {
    width: 38px;
    height: 38px;
    background: #1c414a;
    color: #f0c477;
    font-size: 1.15rem;
}

.ppms-project-credit > span:nth-child(2) { display: grid; gap: .15rem; }
.ppms-project-credit strong { color: #17333e; font-size: .84rem; }
.ppms-project-credit small { color: #788487; font-size: .74rem; }
.ppms-credit-rule { flex: 1; height: 1px; margin: 0 1rem; background: #d8d0c1; }
.ppms-credit-tag { color: #788487; font-size: .65rem; letter-spacing: .15em; }

.ppms-footer {
    padding: 1.5rem 0;
    background: #17333e;
    color: #cad2cf;
    font-size: .76rem;
}

.ppms-footer a { color: #f0c477; text-decoration: none; }
.ppms-footer a:hover { color: #fff; }

@media (max-width: 991.98px) {
    .ppms-navbar .navbar-collapse { padding: .75rem 0 1rem; }
    .ppms-navbar .nav-item { width: 100%; }
    .ppms-navbar .nav-link { padding: .65rem 0; }
    .ppms-login-btn { width: 100%; margin-top: .35rem; }
    .ppms-hero-art { min-height: 350px; }
}

@media (max-width: 575.98px) {
    .ppms-navbar { min-height: 70px; }
    .ppms-brand-mark { width: 38px; height: 38px; }
    .ppms-brand small { font-size: .58rem; }
    .ppms-hero { padding-top: 3.5rem; }
    .ppms-hero h1 { font-size: clamp(2.55rem, 12vw, 3.8rem); }
    .ppms-hero-copy { font-size: .98rem; }
    .ppms-hero-art { min-height: 330px; margin-top: -.5rem; }
    .ppms-art-orbit { width: 275px; height: 275px; }
    .ppms-art-orbit-two { width: 230px; height: 310px; }
    .ppms-art-book { width: 215px; height: 285px; }
    .ppms-book-title { font-size: 2.3rem; }
    .ppms-project-credit { gap: .7rem; margin-top: 2.5rem; }
    .ppms-credit-rule { margin: 0 .2rem; }
    .ppms-credit-tag { font-size: .55rem; }
}
