/* Scoped to Perspective and its boards. Existing site CSS is unchanged. */
body.sea-perspective-page { padding-top:107px; }
body.sea-perspective-page .header { top:0; left:0; height:107px; background:#fff; }
body.sea-perspective-page .header h1 { margin:0; }
body.sea-perspective-page .header h1 a { top:50%; transform:translateY(-50%); }
body.sea-perspective-page > .wrap { height:auto; min-height:calc(100vh - 107px); }
body.sea-perspective-page .contents.perspective-contents { width:100%; max-width:none; margin:0; padding:0; }
body.sea-perspective-page .journal-wrap { width:100%; max-width:none; overflow:visible; }
body.sea-perspective-page .journal-breadcrumb { color:#555; padding-top:28px; }
body.sea-perspective-page .journal-breadcrumb a { color:#555; }
body.sea-perspective-page .journal-header { color:#222; }
body.sea-perspective-page .journal-cate,
body.sea-perspective-page .journal-total { color:#555; }
body.sea-perspective-page #footer { position:relative; left:auto; bottom:auto; min-height:40px; height:auto; padding:12px 0; background:#fff; z-index:1; }
@media all and (max-width:1000px) {
 body.sea-perspective-page { padding-top:70px; }
 body.sea-perspective-page .header { height:70px; }
 body.sea-perspective-page > .wrap { min-height:calc(100vh - 70px); }
 body.sea-perspective-page .header h1 a { top:-4px; transform:none; }
}


/* Modal viewport repair - 20261023 revision 2 */
/* Perspective/Journal modal viewport alignment.
   Loaded after existing styles. Retains existing modal JS and navigation. */
body.sea-perspective-page #dialog.modal,
body.sea-perspective-page #dialog1.modal {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: auto !important;
    bottom: auto !important;
    width: 100% !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    box-sizing: border-box;
    z-index: 10000;
    overflow-y: auto;
}
body.sea-perspective-page #dialog > .modal_menu,
body.sea-perspective-page #dialog1 > .modal_menu {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 100% !important;
    height: 100% !important;
    box-sizing: border-box;
    padding: 64px 24px;
    margin: 0 !important;
}
body.sea-perspective-page #dialog .modal_menu ul,
body.sea-perspective-page #dialog1 .modal_menu ul {
    position: relative;
    width: 700px;
    max-width: 100%;
    margin: 0 auto !important;
    padding: 0;
    text-align: center;
}
body.sea-perspective-page #mask {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100vh !important;
    height: 100dvh !important;
    margin: 0 !important;
    z-index: 9998;
}
body.sea-perspective-page #dialog > .close,
body.sea-perspective-page #dialog1 > .close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 48px;
    height: 48px;
    box-sizing: border-box;
    padding: 0;
    background: url('../images/mo-close.png') no-repeat center;
    background-size: 20px 20px;
    z-index: 10001;
}