/* ============================================================
   PBI OPEN WORLD  —  pitch.black.industries
   Layering: #pbi-world canvas (z0) < slide chrome (z1..10) < UI
   Everything here is inert unless html.pbi-world-on is set
   (the JS sets it only after the first real frame renders).
   ============================================================ */

#pbi-world {
    position: fixed;
    left: 0; top: 0;
    width: 100%; height: 100%;
    z-index: 0;
    display: block;
    pointer-events: none;
    background: #000;
}

/* the world IS the photography on the hero; other slides keep theirs */
html.pbi-world-on #hero .bg-layer { opacity: 0; }
html.pbi-world-on .slide { background-color: transparent; }

/* keep deck text readable over a living sky */
html.pbi-world-on .slide .content::before {
    content: '';
    position: absolute;
    inset: -14% -18%;
    z-index: -1;
    background: radial-gradient(58% 62% at 50% 46%, rgba(0,0,0,.62) 0%, rgba(0,0,0,.42) 46%, rgba(0,0,0,0) 74%);
    pointer-events: none;
}

/* ---------- enter button ---------- */
.pbi-world-enter {
    position: fixed;
    top: 88px;
    right: 24px;
    z-index: 1200;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 10px;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: #FBF9F1;
    background: rgba(4, 4, 6, 0.38);
    border: 1px solid rgba(251, 249, 241, 0.42);
    padding: 13px 20px;
    cursor: pointer;
    transition: color .25s ease, background-color .25s ease, border-color .25s ease;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}
.pbi-world-enter:hover,
.pbi-world-enter:focus-visible {
    color: #05060a;
    background: #FBF9F1;
    border-color: #FBF9F1;
    outline: none;
}
.pbi-world-enter .pbi-dot {
    display: inline-block;
    width: 5px; height: 5px;
    margin-right: 8px;
    border-radius: 50%;
    background: #7fd4c1;
    vertical-align: 1px;
    animation: pbi-pulse 2.6s ease-in-out infinite;
}
@keyframes pbi-pulse {
    0%, 100% { opacity: .35; }
    50% { opacity: 1; }
}
@media (max-width: 640px) {
    .pbi-world-enter { top: 76px; right: 14px; padding: 11px 14px; font-size: 9px; letter-spacing: .26em; }
}

/* ---------- explore mode ---------- */
html.pbi-explore, html.pbi-explore body { overflow: hidden; }

html.pbi-explore #pbi-world {
    z-index: 4000;
    pointer-events: auto;
    cursor: grab;
}
html.pbi-explore #pbi-world.dragging { cursor: grabbing; }

html.pbi-explore .ebook-container {
    opacity: 0;
    pointer-events: none;
    transition: opacity .7s ease;
}
html.pbi-explore .pbi-world-enter { display: none; }
html.pbi-explore .home-btn,
html.pbi-explore .pbi-gallery-btn { opacity: 0; pointer-events: none; }

/* the deck's global vignette must not darken the world twice in explore mode */
html.pbi-explore .vignette { opacity: 0; }

/* ---------- HUD ---------- */
.pbi-world-hud {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 4100;
    display: none;
    align-items: flex-end;
    justify-content: space-between;
    padding: 0 26px 22px;
    pointer-events: none;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    color: #FBF9F1;
}
html.pbi-explore .pbi-world-hud { display: flex; }
.pbi-world-hud .pbi-hud-left,
.pbi-world-hud .pbi-hud-right { pointer-events: auto; }
.pbi-world-hud .pbi-hud-title {
    font-size: 10px;
    letter-spacing: .34em;
    text-transform: uppercase;
    opacity: .92;
}
.pbi-world-hud .pbi-hud-sub {
    margin-top: 7px;
    font-size: 9px;
    letter-spacing: .22em;
    text-transform: uppercase;
    opacity: .48;
}
.pbi-world-hud .pbi-hud-keys {
    font-size: 9px;
    letter-spacing: .22em;
    text-transform: uppercase;
    opacity: .55;
    margin-bottom: 12px;
    text-align: right;
}
.pbi-world-return {
    font-family: inherit;
    font-size: 10px;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: #FBF9F1;
    background: rgba(4, 4, 6, .42);
    border: 1px solid rgba(251,249,241,.42);
    padding: 12px 20px;
    cursor: pointer;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    transition: color .25s, background-color .25s;
}
.pbi-world-return:hover,
.pbi-world-return:focus-visible { color: #05060a; background: #FBF9F1; outline: none; }

/* touch walk buttons */
.pbi-world-touch {
    position: fixed;
    z-index: 4100;
    display: none;
    gap: 12px;
    left: 50%;
    transform: translateX(-50%);
    bottom: 84px;
    pointer-events: none;
}
html.pbi-explore.pbi-touch .pbi-world-touch { display: flex; }
.pbi-world-touch button {
    pointer-events: auto;
    width: 58px; height: 58px;
    border-radius: 50%;
    border: 1px solid rgba(251,249,241,.4);
    background: rgba(4,4,6,.4);
    color: #FBF9F1;
    font-size: 17px;
    font-family: inherit;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    cursor: pointer;
}
.pbi-world-touch button:active { background: rgba(251,249,241,.9); color: #05060a; }

@media (max-width: 640px) {
    .pbi-world-hud { padding: 0 14px 14px; }
    .pbi-world-hud .pbi-hud-keys { display: none; }
}