
/* ============================================================
   写作员工防闪 V2.0.18：全屏同色幕布盖死整个视口，
   不再依赖"写作台是 body 直接子元素"的旧假设。
   写作台实际埋在 #page 内（且带主题 #header / #footer），
   因此这里直接：①整屏铺底 ②盖死幕布 ③隐藏主题页眉页脚等杂项，
   等写作台真正就绪后再淡入揭幕。
   ============================================================ */
html.storyos-writer-preload,
html.storyos-writer-preload body,
body.storyos-ai-worker-page {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    min-height: 100vh !important;
    overflow: hidden !important;
    background: #edf0f5 !important;
}
html.dark-mode.storyos-writer-preload,
html.dark-mode.storyos-writer-preload body { background: #12131f !important; }

/* 同色全屏幕布：盖死整个视口的首帧（页眉/标语/页脚一律盖住） */
html.storyos-writer-preload::before {
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483646 !important;
    background: #edf0f5 !important;
    pointer-events: none !important;
}
html.dark-mode.storyos-writer-preload::before { background: #12131f !important; }

/* ===== 骨架屏：preload 期间盖在幕布之上，画出写作台轮廓，消除"盯空白"焦虑 ===== */
#storyos-skeleton {
    position: fixed !important; inset: 0 !important;
    z-index: 2147483647 !important;       /* 比同色幕布(...646)再高一层 */
    display: flex !important;
    background: #edf0f5 !important;
    pointer-events: none !important;
    opacity: 1; transition: opacity .32s ease;
}
html.dark-mode #storyos-skeleton { background: #12131f !important; }
#storyos-skeleton.sk-hide { opacity: 0 !important; }

/* 左侧栏轮廓：宽度/底色与真实 .left-sidebar 完全对齐(188px / #f8f9fc) */
#storyos-skeleton .sk-side {
    width: 188px; flex-shrink: 0; background: #f8f9fc;
    border-right: 1px solid #e6ebf3; padding: 12px 8px 16px;
    display: flex; flex-direction: column; gap: 10px;
}
html.dark-mode #storyos-skeleton .sk-side { background: #171926; border-right-color: #2a2b40; }
/* V2.0.17.5：骨架屏跟随写作页 V1.43 左栏（目录式 + 集数网格）：不再画卡片，只画标题小条、34px 行和 5 列格子 */
#storyos-skeleton .sk-side .sk-doc { height: 12px; width: 36px; border-radius: 4px; margin: 6px 10px 2px; }
#storyos-skeleton .sk-side .sk-row { height: 18px; border-radius: 6px; margin: 8px 10px; }
#storyos-skeleton .sk-side .sk-row.short { width: 60%; }
#storyos-skeleton .sk-side .sk-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; padding: 4px 4px 0; }
#storyos-skeleton .sk-side .sk-grid i { display: block; height: 30px; border-radius: 8px; }

/* 右侧编辑区轮廓 */
#storyos-skeleton .sk-main { flex: 1; background: #fff; display: flex; flex-direction: column; }
html.dark-mode #storyos-skeleton .sk-main { background: #14151f; }
#storyos-skeleton .sk-main .sk-toolbar { height: 50px; border-bottom: 1px solid #eef1f6; }
html.dark-mode #storyos-skeleton .sk-main .sk-toolbar { border-bottom-color: #262838; }
#storyos-skeleton .sk-main .sk-body { flex: 1; padding: 60px 12% 0; display: flex; flex-direction: column; gap: 18px; }
#storyos-skeleton .sk-main .sk-line { height: 16px; border-radius: 6px; }
#storyos-skeleton .sk-main .sk-line.w1 { width: 40%; height: 26px; }
#storyos-skeleton .sk-main .sk-line.w2 { width: 88%; }
#storyos-skeleton .sk-main .sk-line.w3 { width: 76%; }
#storyos-skeleton .sk-main .sk-line.w4 { width: 82%; }

/* 骨架灰块统一用微光呼吸动画(shimmer) */
#storyos-skeleton .sk-doc,
#storyos-skeleton .sk-row,
#storyos-skeleton .sk-grid i,
#storyos-skeleton .sk-line {
    background: linear-gradient(90deg, #e9edf4 25%, #eff2f8 37%, #e9edf4 63%);
    background-size: 400% 100%;
    animation: skShimmer 1.4s ease infinite;
}
html.dark-mode #storyos-skeleton .sk-doc,
html.dark-mode #storyos-skeleton .sk-row,
html.dark-mode #storyos-skeleton .sk-grid i,
html.dark-mode #storyos-skeleton .sk-line {
    background: linear-gradient(90deg, #1e2030 25%, #242638 37%, #1e2030 63%);
    background-size: 400% 100%;
}
@keyframes skShimmer { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }

/* 写作台模式下，主题页眉/页脚/分隔线本就不该出现 —— 直接彻底移除，既治闪也干净 */
body.storyos-ai-worker-page #header,
body.storyos-ai-worker-page #footer,
body.storyos-ai-worker-page > #page > hr,
body.storyos-ai-worker-page #page > .wp-site-blocks > header,
body.storyos-ai-worker-page #page > .wp-site-blocks > footer {
    display: none !important;
}

/* 预接管期间：藏住写作台 wrapper 以外的一切（用通配 + 排除祖先链，覆盖嵌在 #page 里的情况） */
html.storyos-writer-preload #page > *:not(#saas-fullscreen-app-wrapper):not(script):not(style):not(link) {
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
html.storyos-writer-preload body > *:not(#page):not(script):not(style):not(link) {
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* 写作台 wrapper 始终可见 */
html.storyos-writer-preload #saas-fullscreen-app-wrapper {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* 揭幕后写作台平滑淡入 */
#saas-fullscreen-app-wrapper {
    animation: storyosWriterFadeIn .3s ease both;
}
@keyframes storyosWriterFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}
