/* The entrance keeps the main site's fonts; the diary's serif is loaded only there. */
#loader-wrapper { overflow-y: auto; padding: 28px 0; }
#loader-wrapper .loader-inner { width: min(88vw, 420px); margin: auto; }
#loader-wrapper .loader-ring { width: 64px; height: 64px; margin-bottom: 14px; }
#loader-wrapper .loader-title { margin-bottom: 8px; font-size: 12px; letter-spacing: .14em; }
.loader-invitation { margin: 0 0 24px; font-size: 19px; color: var(--text); }
#loader-wrapper .loader-progress-panel { width: 86%; }
#loader-wrapper .loader-percent { font-size: 38px; }
#loader-wrapper .loader-entry-actions { width: 100%; gap: 10px; margin-top: 26px; }
#loader-wrapper .loader-entry-actions button {
    display: grid; grid-template-columns: 26px minmax(0, 1fr) 18px; gap: 12px;
    width: 100%; min-height: 80px; padding: 14px 20px; border-radius: 14px;
    text-align: left; font-family: inherit; animation: none; cursor: pointer;
    border: 1px solid rgba(232,197,140,.24); color: var(--gold-bright);
    background: linear-gradient(120deg, rgba(232,197,140,.075), rgba(255,255,255,.025));
    box-shadow: inset 0 1px rgba(255,255,255,.06), 0 8px 24px rgba(0,0,0,.15);
    transition: transform .25s, border-color .25s, background .25s;
}
#loader-wrapper .loader-entry-actions button[hidden] { display: none; }
#loader-wrapper .loader-entry-actions strong { display: block; font-size: 15px; font-weight: 500; }
#loader-wrapper .loader-entry-actions small { display: block; margin-top: 5px; color: var(--text-2); font-size: 11px; line-height: 1.5; }
#loader-wrapper .loader-entry-actions svg { width: 20px; height: 20px; }
#loader-wrapper .loader-entry-actions svg:last-child { width: 15px; opacity: .5; }
#loader-wrapper .loader-adventure-start { border-color: rgba(209,181,137,.36); }
#loader-wrapper .loader-treehole-start { border-color: rgba(231,169,178,.18); }
#loader-wrapper .loader-entry-actions button:hover,
#loader-wrapper .loader-entry-actions button:focus-visible { transform: translateY(-2px); border-color: var(--gold); outline: 2px solid transparent; background: rgba(232,197,140,.12); }
#loader-wrapper .loader-entry-actions button:disabled { cursor: wait; opacity: .45; transform: none; }
#loader-wrapper .loader-entry-actions button.is-starting { opacity: 1; }
#adventure-entry-section { position: relative; z-index: 3; padding: 5rem 1.5rem; }
.adventure-entry-book {
    position: relative; display: flex; width: min(100%, 760px); min-height: 370px; margin: auto;
    overflow: hidden; border: 1px solid rgba(216,187,141,.4); border-radius: 5px 16px 16px 5px;
    background: linear-gradient(105deg, #d2bfa4 0, #eee0c8 8%, #f3ebdd 30%, #e9dcc7 100%);
    box-shadow: -8px 8px 0 -4px #ac9476, -13px 13px 0 -7px #dacbb5, 0 28px 65px rgba(0,0,0,.32);
    color: #352c27; text-decoration: none; transition: transform .55s var(--ease-cinematic), box-shadow .55s;
}
.adventure-entry-book::after { content: ''; position: absolute; inset: 15px; border: 1px solid rgba(137,108,70,.2); pointer-events: none; }
.adventure-entry-spine { display: flex; align-items: center; justify-content: center; width: 62px; padding: 25px 17px; border-right: 1px solid rgba(109,81,47,.2); writing-mode: vertical-rl; font-size: 11px; letter-spacing: .3em; color: #78634b; }
.adventure-entry-content { display: block; padding: 38px 44px; }
.adventure-entry-kicker { display: block; color: #806b50; font-size: 10px; letter-spacing: .09em; }
.adventure-entry-title { display: block; margin-top: 16px; font-family: 'ParagraphFont', 'Songti SC', serif; font-size: 42px; line-height: 1.32; letter-spacing: .08em; }
.adventure-entry-rule { display: block; width: 44px; height: 1px; margin: 20px 0 16px; background: #a78959; }
.adventure-entry-copy { display: block; color: #776553; font-size: 13px; line-height: 1.9; }
.adventure-entry-action { display: flex; align-items: center; gap: 16px; margin-top: 22px; font-size: 12px; color: #6e5038; }
.adventure-entry-action svg { width: 18px; height: 18px; transition: transform .3s; }
.adventure-entry-seal { position: absolute; right: 38px; bottom: 40px; padding: 8px; border: 1px solid #934c43; color: #934c43; font-family: serif; font-size: 13px; line-height: 1.4; transform: rotate(-5deg); }
.adventure-entry-book:hover { transform: translateY(-5px) rotate(-.25deg); box-shadow: -8px 8px 0 -4px #ac9476, -13px 13px 0 -7px #dacbb5, 0 35px 75px rgba(0,0,0,.4); }
.adventure-entry-book:hover .adventure-entry-action svg { transform: translateX(5px); }
.adventure-entry-book:focus-visible { outline: 3px solid var(--gold); outline-offset: 6px; }
@media (max-width: 600px) {
    #adventure-entry-section { padding: 4rem 1rem; }
    .adventure-entry-book { min-height: 350px; }
    .adventure-entry-spine { width: 38px; padding: 20px 10px; font-size: 9px; }
    .adventure-entry-content { padding: 30px 24px; }
    .adventure-entry-title { font-size: 34px; }
    .adventure-entry-seal { right: 24px; bottom: 30px; font-size: 11px; }
}
@media (max-height: 720px) {
    #loader-wrapper .loader-ring { width: 46px; height: 46px; margin-bottom: 8px; }
    .loader-invitation { margin-bottom: 14px; }
    #loader-wrapper .loader-entry-actions { margin-top: 18px; gap: 8px; }
    #loader-wrapper .loader-entry-actions button { min-height: 68px; padding: 10px 18px; }
}
@media (prefers-reduced-motion: reduce) {
    #loader-wrapper .loader-entry-actions button, .adventure-entry-book, .adventure-entry-action svg { transition: none; }
    .adventure-entry-book:hover { transform: none; }
}