:root{--global-bar-height:0px}
body:has(#smg55-global-bar){--global-bar-height:36px}


@media(max-width:700px){
  .site-header{--mobile-masthead-height:136px;position:sticky;top:calc(-1 * var(--mobile-masthead-height))}
  /* Star global bar (fixed at the top, 36px): keep the sticky navigation row below it */
  body:has(#smg55-global-bar) .site-header{top:calc(var(--global-bar-height) - var(--mobile-masthead-height))}
}

        .watch {
            display: none;
        }

        html.has-pwu .watch {
            display: inline-flex;
        }
.custom-modal-overlay {
            display: none;
            position: fixed;
            inset: 0;
            z-index: 1000;
            background: rgba(0, 0, 0, 0.5);
            align-items: center;
            justify-content: center;
            padding: 16px;
        }

            .custom-modal-overlay.is-open {
                display: flex;
            }

        .custom-modal-box {
            position: relative;
            background: #fff;
            border-radius: 12px;
            padding: 24px;
            width: 100%;
            max-width: 360px;
            box-shadow: 0 10px 40px rgba(0, 0, 0, 0.25);
        }

        .custom-modal-close {
            position: absolute;
            top: 8px;
            right: 12px;
            border: none;
            background: none;
            font-size: 24px;
            line-height: 1;
            color: #888;
            cursor: pointer;
        }

            .custom-modal-close:hover {
                color: #333;
            }

        .share-more-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 12px;
        }

        .share-more-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 6px;
            padding: 12px 8px;
            border: 1px solid #e5e5e5;
            border-radius: 10px;
            background: #fff;
            font-size: 12px;
            color: #333;
            cursor: pointer;
            transition: background 0.15s ease, border-color 0.15s ease;
        }

            .share-more-item:hover {
                background: #f5f5f5;
                border-color: #ccc;
            }