/* ───────────────────────────────────────────────────────────────────────────
 * Nowen「分享笔记」弹窗 —— 手机端按钮区不可见 修复（Hermes 2026-10-11，v4 2026-10-15）
 *
 * 症状（仅小屏）：手机打开分享笔记弹窗，只能看到「创建新分享」表单，右侧
 *   「已创建的分享」区块（含 复制/编辑/清零/换链接/停用 按钮）看不到也滚不到。
 *   桌面端一切正常。
 *
 * v4 的重要修正：**整份规则必须只在小屏生效**。
 *   v3 把 div.max-h-[92vh] 的 overflow-x:hidden 与「后代 overflow:visible」写在
 *   媒体查询之外 → 桌面端也被改了 ✗：面板里那串超长分享链接本来由区块自己裁住，
 *   被放开后文字溢出到弹窗右侧、又被面板裁掉 → 表现为「右半边显示不全 / 按钮被切」。
 *   所以现在整份规则统一包在 @media (max-width: 1023.98px) 里；
 *   更可靠的判断由同目录的 __nowen-share-fix.js 按**布局**做（WebView 宽度不可信），
 *   这个 CSS 只作兜底。
 * ─────────────────────────────────────────────────────────────────────────── */
@media (max-width: 1023.98px) {
    /* 1) 面板成为唯一滚动容器（覆盖应用原本的 overflow-hidden） */
    div.max-h-\[92vh\] {
        overflow-y: auto !important;
        overflow-x: hidden !important;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    /* 2) 内部一律放开：正文网格 / 两个 section 都不再各自滚动、不再限高 */
    div.max-h-\[92vh\] > .grid,
    div.max-h-\[92vh\] > div,
    div.max-h-\[92vh\] > div > section,
    div.max-h-\[92vh\] section {
        overflow: visible !important;
        max-height: none !important;
        /* 必须是 auto：写 0 会把区块压得比内容矮 → 内容溢出行互相盖住 ✗ */
        min-height: auto !important;
        flex: none !important;
        height: auto !important;
    }

    /* 3) 小屏下两个区块按内容自然高度堆叠 */
    .max-h-\[92vh\] > .grid {
        display: block !important;
    }

    .max-h-\[92vh\] > .grid > section:first-child {
        padding-bottom: 1.25rem;
    }

    .max-h-\[92vh\] > .grid > section:last-child {
        padding-bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px));
    }

    .max-h-\[92vh\] > .grid > section:last-child button {
        flex: 0 0 auto;
    }

    /* 分享链接文字：小屏允许断行，避免撑破卡片 */
    .max-h-\[92vh\] > .grid > section:last-child article,
    .max-h-\[92vh\] > .grid > section:last-child article * {
        overflow-wrap: anywhere;
        word-break: break-word;
    }
}