/*!
 * 奇营后台美化 QYAdmin —— 后台皮肤
 * 覆盖 Typecho 原生后台样式，提供顶部 / 侧边两种布局、亮暗双主题与卡片化内容。
 * 所有颜色来自 CSS 变量，主色由插件设置注入（见 Plugin::cssVars）。
 */

/* ==========================================================================
   1. 设计变量
   ========================================================================== */
:root {
    --qy-primary: #0066ff;
    --qy-primary-hover: #0052cc;
    --qy-primary-soft: rgba(0, 102, 255, .12);
    --qy-primary-line: rgba(0, 102, 255, .3);

    --qy-bg: #f2f5f9;
    --qy-surface: #ffffff;
    --qy-surface-2: #f7f9fc;
    --qy-surface-3: #eef2f8;
    --qy-border: #e6ebf2;
    --qy-border-strong: #d7e0ec;
    --qy-text: #1e2430;
    --qy-text-2: #4a5468;
    --qy-muted: #7a8699;
    --qy-danger: #e5484d;
    --qy-success: #12a150;
    --qy-warning: #e8a33d;

    --qy-radius: 12px;
    --qy-radius-sm: 8px;
    --qy-nav-h: 58px;
    --qy-side-w: 232px;
    --qy-shadow-sm: 0 1px 2px rgba(16, 24, 40, .04);
    --qy-shadow: 0 4px 14px rgba(16, 24, 40, .06);
    --qy-shadow-lg: 0 18px 48px rgba(16, 24, 40, .12);

    --qy-nav-bg: #1e2430;
    --qy-nav-fg: #aab4c5;
    --qy-nav-fg-active: #ffffff;
    --qy-nav-active: rgba(255, 255, 255, .1);
}

html[data-qy-theme="dark"] {
    --qy-bg: #0e1218;
    --qy-surface: #161b23;
    --qy-surface-2: #1b212a;
    --qy-surface-3: #222a35;
    --qy-border: #252d38;
    --qy-border-strong: #313b48;
    --qy-text: #e6e9ef;
    --qy-text-2: #c3cad5;
    --qy-muted: #8f9aab;
    --qy-nav-bg: #11161d;
    --qy-nav-fg: #9aa4b4;
    --qy-nav-active: rgba(255, 255, 255, .08);
    --qy-shadow-sm: 0 1px 2px rgba(0, 0, 0, .35);
    --qy-shadow: 0 4px 14px rgba(0, 0, 0, .4);
    --qy-shadow-lg: 0 18px 48px rgba(0, 0, 0, .55);
}

/* ==========================================================================
   2. 基础
   ========================================================================== */
body {
    background: var(--qy-bg);
    color: var(--qy-text);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
        "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    padding-top: var(--qy-nav-h);
    -webkit-font-smoothing: antialiased;
}

/* 锚点跳转（如 profile.php#change-password）要给固定导航让位，否则目标区块被导航盖住 */
html { scroll-padding-top: calc(var(--qy-nav-h) + 10px); }

/* 列表页内容长、设置页内容短，两者切换时滚动条会出现 / 消失，
   导致整页内容横向位移（晃动）。给后台页面常驻滚动条槽即可消除该位移。
   登录页没有导航栏，不套用本条。 */
html:has(body > .typecho-head-nav) { overflow-y: scroll; }

/* 登录页 body.body-100 本身就要 100vh 居中，不能再让导航高度占位，
   否则卡片整体下移且整页多出一条滚动条。 */
body.body-100 { padding-top: 0; }

a { color: var(--qy-primary); }
a:hover { color: var(--qy-primary-hover); }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
    background: rgba(120, 130, 150, .28);
    border-radius: 8px;
    border: 3px solid transparent;
    background-clip: padding-box;
}
::-webkit-scrollbar-thumb:hover { background: rgba(120, 130, 150, .48); background-clip: padding-box; }

/* ==========================================================================
   3. 导航（顶部布局为默认形态）
   ========================================================================== */
/* Typecho 原生是 position:sticky，叠加 body 的 padding-top 后导航会悬空在
   页面下方 58px（顶上露出背景条），滚动时又要先上滑 58px 才吸顶，视觉上就是
   "导航在晃动"。这里改为固定定位，body 的 padding-top 正好等于导航高度。 */
.typecho-head-nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: var(--qy-nav-h);
    z-index: 300;
    padding: 0 16px;
    background: var(--qy-surface);
    border-bottom: 1px solid var(--qy-border);
    box-shadow: var(--qy-shadow-sm);
}

.typecho-head-nav a,
.typecho-head-nav .menu-bar summary {
    height: var(--qy-nav-h);
    line-height: var(--qy-nav-h);
    padding: 0 15px;
    color: var(--qy-muted);
    font-size: 14px;
    font-weight: 500;
}

.typecho-head-nav a:focus,
.typecho-head-nav a:hover,
.typecho-head-nav .menu-bar summary:focus,
.typecho-head-nav .menu-bar summary:hover {
    color: var(--qy-primary);
    background: transparent;
}

.typecho-head-nav menu { background: transparent; }

.typecho-head-nav nav > menu > li:first-child { border-left: none; }

.typecho-head-nav nav > menu > li > a {
    height: 40px;
    line-height: 40px;
    padding: 0 14px;
    margin: 9px 2px;
    border-right: none;
    border-radius: var(--qy-radius-sm);
}

.typecho-head-nav nav > menu > li > a:hover,
.typecho-head-nav nav > menu > li > a:focus,
.typecho-head-nav nav > menu > li:not(.operate):hover > a,
.typecho-head-nav nav > menu > li:not(.operate).focus > a {
    background: var(--qy-primary-soft);
    color: var(--qy-primary);
    font-weight: 600;
}

/* 下拉子菜单 */
.typecho-head-nav nav > menu > li > menu {
    top: var(--qy-nav-h);
    padding: 8px;
    min-width: 184px;
    background: var(--qy-surface);
    border: 1px solid var(--qy-border);
    border-radius: 0 0 var(--qy-radius) var(--qy-radius);
    box-shadow: var(--qy-shadow-lg);
}

.typecho-head-nav nav > menu > li > menu > li a {
    height: 38px;
    line-height: 38px;
    padding: 0 14px;
    border-radius: var(--qy-radius-sm);
    color: var(--qy-text-2);
}

.typecho-head-nav nav > menu > li > menu > li a:hover,
.typecho-head-nav nav > menu > li > menu > li a:focus {
    background: var(--qy-surface-2);
    color: var(--qy-primary);
}

.typecho-head-nav nav > menu > li > menu > li.focus a {
    background: var(--qy-primary-soft);
    color: var(--qy-primary);
    font-weight: 600;
}

/* 顶部导航：点击一级目录后保持展开（原生只有 :hover/:focus-within 才显示） */
.typecho-head-nav nav > menu > li.qy-open > menu { display: flex; }
.typecho-head-nav nav > menu > li.qy-open > a {
    background: var(--qy-primary-soft);
    color: var(--qy-primary);
    font-weight: 600;
}

/* 右侧账号区 */
.typecho-head-nav nav > menu > li.operate { align-items: center; }

.typecho-head-nav nav > menu > li.operate a {
    height: 34px;
    line-height: 34px;
    padding: 0 12px;
    margin: 0 2px;
    border: none;
    border-radius: var(--qy-radius-sm);
}

.typecho-head-nav nav > menu > li.operate a:first-child { border-left: none; }

.typecho-head-nav nav > menu > li.operate a:hover {
    background: var(--qy-primary-soft);
    color: var(--qy-primary);
}

/* 布局 / 主题切换按钮 */
.qy-tool {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    margin: 0 2px;
    padding: 0;
    border: none;
    background: transparent;
    color: var(--qy-muted);
    border-radius: var(--qy-radius-sm);
    cursor: pointer;
    vertical-align: middle;
    transition: background .18s ease, color .18s ease;
}

.qy-tool svg { width: 17px; height: 17px; display: block; }
.qy-tool:hover { background: var(--qy-primary-soft); color: var(--qy-primary); }

/* 抽屉遮罩仅移动端存在样式，桌面端隐藏（JS 始终注入节点） */
.qy-nav-mask { display: none; }

/* 手机抽屉专用节点（用户卡 / 子菜单展开按钮）：桌面端隐藏，仅 ≤575px 媒体块内显示 */
.qy-drawer-user,
.qy-sub-toggle { display: none; }

/* ==========================================================================
   4. 移动端抽屉（≤575px）—— lovestu 风格
   顶部毛玻璃触发条 + 左滑卡片面板 + 遮罩 + 手风琴分组
   ========================================================================== */
@media (max-width: 575px) {
    body { padding-top: 52px; }

    /* 触发条：常驻视口顶部；打开后随面板成为面板顶栏。
       高度必须与 body 的 padding-top(52px) 一致，否则导航与内容之间会空出一条背景带，
       并且这条透明区域会拦截内容区顶部 6px 的点击。 */
    .typecho-head-nav { height: 52px; padding: 0; background: transparent; border-bottom: none; box-shadow: none; }

    .typecho-head-nav nav {
        position: fixed;
        top: 0;
        left: 0;
        display: flex;
        flex-direction: column;
        width: 100vw;
        height: 52px;
        overflow: hidden;
        z-index: 1020;
        background: var(--qy-surface);
        transition: width .26s ease, height .26s ease, flex-basis .26s ease, background-color .2s ease, box-shadow .26s ease;
    }

    /* 打开：从顶部条横向展开为左侧面板。
       注意：nav 虽是 fixed，但父 header 为 flex column，主轴尺寸会被 flex 算法压缩，
       必须同时锁定 flex-basis 与 height（vh/dvh 双写）才能撑满视口 */
    .typecho-head-nav nav:has(.menu-bar[open]) {
        width: 86vw;
        max-width: 340px;
        flex: 0 0 100vh;
        flex: 0 0 100dvh;
        height: 100vh;
        height: 100dvh;
        background: var(--qy-bg);
        box-shadow: 8px 0 40px rgba(17, 20, 30, .22);
    }

    .typecho-head-nav .menu-bar {
        display: block;
        flex: 0 0 52px;
        height: 52px;
        background: transparent;
    }

    .typecho-head-nav .menu-bar summary {
        display: flex;
        align-items: center;
        gap: 10px;
        height: 52px;
        padding: 0 16px;
        margin: 0;
        font-size: 15px;
        font-weight: 600;
        color: var(--qy-text);
        cursor: pointer;
        list-style: none;
        letter-spacing: .3px;
        background: rgba(255, 255, 255, .92);
        border-bottom: 1px solid var(--qy-border);
        -webkit-backdrop-filter: saturate(180%) blur(18px);
        backdrop-filter: saturate(180%) blur(18px);
    }

    html[data-qy-theme="dark"] .typecho-head-nav .menu-bar summary {
        background: rgba(22, 27, 35, .92);
    }

    .typecho-head-nav .menu-bar summary::-webkit-details-marker { display: none; }

    /* 汉堡 / 关闭图标（CSS mask，颜色跟随 currentColor） */
    .typecho-head-nav .menu-bar summary::before {
        content: "";
        flex-shrink: 0;
        width: 22px;
        height: 22px;
        background-color: currentColor;
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M3 6h18M3 12h18M3 18h18'/%3E%3C/svg%3E") center / contain no-repeat;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M3 6h18M3 12h18M3 18h18'/%3E%3C/svg%3E") center / contain no-repeat;
    }

    .typecho-head-nav .menu-bar[open] summary::before {
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E") center / contain no-repeat;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E") center / contain no-repeat;
    }

    /* 菜单容器：白色圆角卡片，占满剩余高度并自行滚动 */
    .typecho-head-nav nav > menu {
        display: none;
        flex: 1 1 auto;
        flex-flow: column;
        gap: 0;
        align-self: stretch;
        width: auto;
        min-width: 0;
        box-sizing: border-box;
        min-height: 0;
        margin: 12px;
        overflow-y: auto;
        padding: 0;
        background: var(--qy-surface);
        border: none;
        border-radius: var(--qy-radius);
        box-shadow: var(--qy-shadow-sm);
        scrollbar-width: none;
    }
    .typecho-head-nav nav > menu::-webkit-scrollbar { display: none; }
    .typecho-head-nav .menu-bar[open] ~ menu { display: flex; }

    /* 顶部用户信息卡（节点由 qyadmin.js 注入） */
    .qy-drawer-user {
        flex-shrink: 0;
        display: flex;
        align-items: center;
        gap: 8px;
        margin: 0 12px;
        padding: 10px 10px 10px 12px;
        background: var(--qy-surface);
        border-radius: var(--qy-radius);
        box-shadow: var(--qy-shadow-sm);
    }

    /* 选择器均带 .typecho-head-nav 前缀，压过原生 `.typecho-head-nav a` 的高度/内边距 */
    .typecho-head-nav .qy-du-profile {
        display: flex;
        align-items: center;
        gap: 9px;
        flex: 1 1 auto;
        min-width: 0;
        height: auto;
        margin: 0;
        padding: 0;
        line-height: 1.3;
        color: var(--qy-text);
        border-radius: var(--qy-radius-sm);
    }
    .typecho-head-nav .qy-du-profile:active { background: var(--qy-surface-2); }

    .qy-du-avatar {
        flex-shrink: 0;
        width: 40px;
        height: 40px;
        display: grid;
        place-items: center;
        border-radius: 50%;
        background: var(--qy-primary-soft);
        color: var(--qy-primary);
        font-size: 16px;
        font-weight: 600;
    }

    .qy-du-meta {
        display: flex;
        flex-direction: column;
        min-width: 0;
    }

    .qy-du-name {
        font-size: 14px;
        font-weight: 600;
        color: var(--qy-text);
        line-height: 1.35;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .qy-du-sub {
        font-size: 11.5px;
        color: var(--qy-muted);
        line-height: 1.35;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .qy-du-actions {
        display: flex;
        gap: 8px;
        flex-shrink: 0;
    }

    /* 网站 / 登出：纯图标方钮，文字走 title/aria-label，把横向空间留给用户名 */
    /* 带 .typecho-head-nav 前缀压过原生 `.typecho-head-nav a`(height/padding) */
    .typecho-head-nav .qy-du-btn {
        display: grid;
        place-items: center;
        width: 38px;
        height: 38px;
        margin: 0;
        padding: 0;
        line-height: 1;
        border: 1px solid var(--qy-border);
        border-radius: 10px;
        background: var(--qy-surface-2);
        color: var(--qy-text-2);
    }
    .typecho-head-nav .qy-du-btn span { display: none; }
    .typecho-head-nav .qy-du-btn svg { width: 18px; height: 18px; }
    .typecho-head-nav .qy-du-btn:active {
        background: var(--qy-primary-soft);
        border-color: var(--qy-primary-line);
        color: var(--qy-primary);
    }
    .typecho-head-nav .qy-du-btn.is-logout:active {
        background: rgba(229, 72, 77, .1);
        border-color: rgba(229, 72, 77, .3);
        color: var(--qy-danger);
    }

    /* 一级菜单项：50px 整行 + 细分隔线 */
    .typecho-head-nav nav > menu > li {
        position: relative;
        border: none;
        background: transparent;
    }

    .typecho-head-nav nav > menu > li > a {
        display: flex;
        align-items: center;
        min-height: 50px;
        height: auto;
        line-height: 1.4;
        margin: 0;
        padding: 0 16px;
        font-size: 15px;
        color: var(--qy-text);
        border-radius: 0;
        box-shadow: inset 0 -1px 0 var(--qy-border);
    }

    .typecho-head-nav nav > menu > li > a:hover,
    .typecho-head-nav nav > menu > li:not(.operate).focus > a {
        background: var(--qy-primary-soft);
        color: var(--qy-primary);
    }

    /* 有子菜单的行：链接文字正常可点，右侧独立按钮展开（JS 注入） */
    .typecho-head-nav nav > menu > li:has(> menu) > a { padding-right: 54px; }
    .typecho-head-nav nav > menu > li:has(> menu) > a::after { display: none; }

    .qy-sub-toggle {
        position: absolute;
        top: 5px;
        right: 10px;
        z-index: 2;
        width: 44px;
        height: 40px;
        display: grid;
        place-items: center;
        padding: 0;
        border: 0;
        border-radius: 10px;
        background: transparent;
        color: var(--qy-muted);
    }
    .qy-sub-toggle:active { background: var(--qy-surface-3); color: var(--qy-primary); }
    .qy-sub-toggle svg { width: 17px; height: 17px; transition: transform .2s ease; }
    .typecho-head-nav nav > menu > li.qy-open > .qy-sub-toggle svg { transform: rotate(90deg); }

    /* 二级菜单：浅灰内嵌区，缩进展示层级 */
    .typecho-head-nav nav > menu > li > menu {
        position: static;
        display: none;
        width: auto;
        min-width: 0;
        top: auto;
        margin: 0;
        padding: 2px 8px 8px 14px;
        background: var(--qy-surface-2);
        border: none;
        border-radius: 0;
        box-shadow: none;
    }

    .typecho-head-nav nav > menu > li.qy-open > menu { display: block; }

    .typecho-head-nav nav > menu > li > menu > li a {
        display: flex;
        align-items: center;
        min-height: 42px;
        height: auto;
        line-height: 1.4;
        margin: 0;
        padding: 0 14px;
        font-size: 14px;
        color: var(--qy-text-2);
        border-radius: var(--qy-radius-sm);
        white-space: normal;
    }

    .typecho-head-nav nav > menu > li > menu > li a:hover { background: var(--qy-surface-3); color: var(--qy-primary); }
    .typecho-head-nav nav > menu > li > menu > li.focus a { background: var(--qy-primary-soft); color: var(--qy-primary); }

    /* 账号操作已移至顶部用户卡，原 operate 区在抽屉中隐藏 */
    .typecho-head-nav nav > menu > li.operate { display: none; }

    /* 遮罩（节点由 qyadmin.js 注入到 header 内，z-index 低于同上下文的 nav:1020） */
    .qy-nav-mask {
        display: block;
        position: fixed;
        inset: 0;
        flex: 0 0 100dvh;
        width: 100vw;
        z-index: 1019;
        background: rgba(17, 20, 30, .5);
        opacity: 0;
        visibility: hidden;
        transition: opacity .25s ease, visibility .25s ease;
    }

    .qy-nav-mask.qy-show { opacity: 1; visibility: visible; }
    html.qy-nav-open, html.qy-nav-open body { overflow: hidden; }
}

/* ==========================================================================
   5. 左侧栏布局（≥880px 生效，窄屏自动退回顶部导航形态）
   ========================================================================== */
@media (min-width: 880px) {
    html[data-qy-layout="side"] body {
        padding-top: 0;
        padding-left: var(--qy-side-w);
    }

    html[data-qy-layout="side"] .typecho-head-nav {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: var(--qy-side-w);
        height: 100vh;
        padding: 0;
        flex-flow: column;
        background: var(--qy-nav-bg);
        border-bottom: none;
        box-shadow: var(--qy-shadow);
        z-index: 200;
    }

    html[data-qy-layout="side"] .typecho-head-nav nav {
        display: flex;
        flex-flow: column;
        width: 100%;
        height: 100%;
        overflow: visible;
    }

    html[data-qy-layout="side"] .typecho-head-nav nav > menu {
        flex: 1;
        display: flex;
        flex-flow: column;
        width: 100%;
        min-width: 0;
        background: transparent;
        padding: 14px 12px 10px;
        overflow-y: auto;
        overflow-x: hidden;
    }

    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li { border: none; }

    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li > a {
        display: block;
        height: 42px;
        line-height: 42px;
        margin: 2px 0;
        padding: 0 14px;
        border: none;
        border-right: none;
        border-radius: var(--qy-radius-sm);
        color: var(--qy-nav-fg);
        font-size: 14px;
        font-weight: 500;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li > a:hover,
    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li:not(.operate):hover > a,
    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li:not(.operate).qy-open > a {
        background: var(--qy-nav-active);
        color: var(--qy-nav-fg-active);
    }

    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li:not(.operate).focus > a {
        background: var(--qy-primary);
        color: #fff;
        font-weight: 600;
    }

    /* 手风琴子菜单 */
    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li > menu {
        position: static;
        display: none;
        flex-flow: column;
        min-width: 0;
        max-width: none;
        padding: 2px 0 8px;
        background: transparent;
        border: none;
        box-shadow: none;
    }

    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li > menu.qy-open { display: flex; }

    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li:hover > menu:not(.qy-open),
    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li:focus-within > menu:not(.qy-open) {
        display: none;
    }

    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li > menu > li a {
        height: 36px;
        line-height: 36px;
        margin: 1px 0;
        padding: 0 12px 0 18px;
        border-radius: var(--qy-radius-sm);
        color: var(--qy-nav-fg);
        font-size: 13px;
        opacity: .82;
    }

    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li > menu > li a:hover {
        background: var(--qy-nav-active);
        color: #fff;
        opacity: 1;
    }

    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li > menu > li.focus a {
        background: transparent;
        color: #fff;
        font-weight: 600;
        opacity: 1;
    }

    /* 账号区固定在栏底 */
    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li.operate {
        margin-top: auto;
        flex-flow: row;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: center;
        gap: 4px;
        width: 100%;
        padding: 10px 14px 12px;
        border-top: 1px solid rgba(255, 255, 255, .08);
    }

    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li.operate a {
        flex: 0 0 auto;
        height: 30px;
        line-height: 30px;
        padding: 0 10px;
        margin: 0;
        border: none;
        border-radius: 6px;
        color: var(--qy-nav-fg);
        font-size: 13px;
    }

    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li.operate a:hover {
        background: var(--qy-nav-active);
        color: #fff;
    }

    html[data-qy-layout="side"] .typecho-head-nav nav > menu > li.operate a.author {
        font-weight: 600;
        color: #fff;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    html[data-qy-layout="side"] .qy-tool { color: var(--qy-nav-fg); }
    html[data-qy-layout="side"] .qy-tool:hover { background: var(--qy-nav-active); color: #fff; }
}

/* ==========================================================================
   6. 主题设置页（奇营主题自带面板）不套用卡片样式
   ========================================================================== */
html[data-qy-exempt="1"] ul.typecho-option {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
    margin: 0 0 20px;
}

/* ==========================================================================
   7. 页头
   ========================================================================== */
/* 标题过长时允许整块换行（避免标题与右侧按钮互相挤压、重叠），
   按钮不允许被压缩或折行 */
.typecho-page-title { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 24px 0 16px; }

.typecho-page-title h2 {
    min-width: 0;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: .2px;
    color: var(--qy-text);
}

.typecho-page-title a {
    flex: 0 0 auto;
    padding: 7px 15px;
    margin-left: 0;
    white-space: nowrap;
    font-size: 12.5px;
    font-weight: 600;
    color: #fff;
    background: var(--qy-primary);
    border-radius: var(--qy-radius-sm);
    box-shadow: var(--qy-shadow-sm);
}

.typecho-page-title a:hover { background: var(--qy-primary-hover); color: #fff; }

/* ==========================================================================
   8. 提示块 / 首页欢迎区
   ========================================================================== */
.message {
    background: var(--qy-surface);
    border: 1px solid var(--qy-border);
    border-radius: var(--qy-radius);
    padding: 18px 20px;
    box-shadow: var(--qy-shadow-sm);
    color: var(--qy-text);
}

.message a { text-decoration: none; font-weight: 600; }

#typecho-welcome h3 { margin: 0 0 12px; font-size: 15px; font-weight: 600; }
#typecho-welcome ol { margin: 0 0 16px; padding-left: 20px; color: var(--qy-text-2); line-height: 2; }
#typecho-welcome ol a { text-decoration: none; }
#typecho-welcome ol a:hover { text-decoration: underline; }

/* ==========================================================================
   9. 按钮
   ========================================================================== */
.btn {
    height: 34px;
    line-height: 32px;
    padding: 0 14px;
    white-space: nowrap;
    color: var(--qy-text-2);
    background: var(--qy-surface);
    border: 1px solid var(--qy-border);
    border-radius: var(--qy-radius-sm);
    font-weight: 500;
    box-shadow: var(--qy-shadow-sm);
}

.btn:hover,
.btn:focus {
    color: var(--qy-text);
    background: var(--qy-surface-3);
    border-color: var(--qy-border-strong);
}

.btn:active,
.btn.active { background: var(--qy-surface-3); }

.btn:disabled {
    color: var(--qy-muted);
    background: var(--qy-surface-2);
    border-color: var(--qy-border);
}

.btn-xs { height: 28px; line-height: 26px; padding: 0 10px; font-size: 12px; }
.btn-s { height: 30px; line-height: 28px; }
.btn-l { height: 46px; line-height: 44px; font-size: 14px; font-weight: 600; }

.primary {
    color: #fff;
    background: var(--qy-primary);
    border-color: var(--qy-primary);
}

.primary:hover,
.primary:focus {
    color: #fff;
    background: var(--qy-primary-hover);
    border-color: var(--qy-primary-hover);
}

.primary:active,
.primary.active { background: var(--qy-primary-hover); border-color: var(--qy-primary-hover); }
.primary:disabled { background: var(--qy-primary); border-color: var(--qy-primary); opacity: .55; }

.btn-warn { color: #fff; background: var(--qy-danger); border-color: var(--qy-danger); }
.btn-warn:hover,
.btn-warn:focus { color: #fff; background: #cf3b40; border-color: #cf3b40; }

.btn-link {
    background: transparent;
    border-color: transparent;
    box-shadow: none;
}

.btn-link:hover { background: var(--qy-surface-3); border-color: transparent; }

/* ==========================================================================
   10. 表单控件
   ========================================================================== */
input[type=text],
input[type=url],
input[type=password],
input[type=email],
input[type=number],
input[type=search],
input[type=tel],
textarea,
select {
    background: var(--qy-surface);
    border: 1px solid var(--qy-border);
    border-radius: var(--qy-radius-sm);
    color: var(--qy-text);
    box-shadow: none;
}

input[type=text],
input[type=url],
input[type=password],
input[type=email],
input[type=number],
input[type=search],
input[type=tel],
textarea { padding: 8px 10px; }

input[type=text]:focus,
input[type=url]:focus,
input[type=password]:focus,
input[type=email]:focus,
input[type=number]:focus,
input[type=search]:focus,
input[type=tel]:focus,
textarea:focus,
select:focus {
    border-color: var(--qy-primary);
    box-shadow: 0 0 0 3px var(--qy-primary-soft);
    outline: none;
}

input[type=text]:disabled,
input[type=text][readonly],
textarea:disabled,
textarea[readonly] {
    background: var(--qy-surface-2);
    color: var(--qy-muted);
}

select { height: 36px; padding: 0 10px; }

input.text-l,
textarea.text-l { padding: 12px 14px; font-size: 15px; }

input[type=checkbox],
input[type=radio] { accent-color: var(--qy-primary); }

input[type=color].qy-color-native {
    width: 38px;
    height: 38px;
    margin-left: 8px;
    padding: 2px;
    vertical-align: middle;
    background: var(--qy-surface);
    border: 1px solid var(--qy-border);
    border-radius: var(--qy-radius-sm);
    cursor: pointer;
}

/* ==========================================================================
   11. 表格
   ========================================================================== */
/* 列宽由内容决定：勾选框、日期、状态这类短列自动收窄，标题列拿到剩余空间。
   原来 table-layout:fixed 会让各列等分，标题只有七八十字宽、被迫折行。 */
.typecho-list-table {
    width: 100%;
    table-layout: auto;
    border-collapse: separate;
    border-spacing: 0;
    background: var(--qy-surface);
    border: 1px solid var(--qy-border);
    border-radius: var(--qy-radius);
    box-shadow: var(--qy-shadow-sm);
}

.typecho-list-table th {
    padding: 13px 16px;
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 600;
    color: var(--qy-muted);
    background: var(--qy-surface-2);
    border-bottom: 1px solid var(--qy-border);
}

.typecho-list-table td {
    padding: 13px 16px;
    color: var(--qy-text-2);
    border-top: 1px solid var(--qy-border);
    /* 原来用 break-all 会把英文单词、日期从中间切断（标题出现半截换行）；
       anywhere 只在装不下时才断，且不会把表格撑宽出横向滚动条 */
    overflow-wrap: anywhere;
    word-break: normal;
}

.typecho-list-table tbody tr:hover { background: var(--qy-surface-2); }

.typecho-list-table tbody tr:has(input[type=checkbox]:checked) { background: var(--qy-primary-soft); }

.typecho-list-table thead th:first-child { border-top-left-radius: var(--qy-radius); }
.typecho-list-table thead th:last-child { border-top-right-radius: var(--qy-radius); }
.typecho-list-table tbody tr:last-child td:first-child { border-bottom-left-radius: var(--qy-radius); }
.typecho-list-table tbody tr:last-child td:last-child { border-bottom-right-radius: var(--qy-radius); }

/* 勾选列、评论数列收到最窄，把宽度全让给标题列（nowrap 保证收窄时文字不被压断）。
   注意：不能用 td:has(.status)（草稿/私密徽标在标题列里）也不能用 td:last-child
   （评论列表最后一列是评论正文），否则会把正文列挤成一列字。 */
.typecho-list-table td:has(> input[type="checkbox"]),
.typecho-list-table td:has(.balloon-button) { width: 1%; white-space: nowrap; }

.typecho-list-table td a { text-decoration: none; }
.typecho-list-table td a:hover { text-decoration: underline; }

.typecho-list-table .status { color: var(--qy-muted); }

/* ==========================================================================
   12. 工具条 / 分页 / 选项卡
   ========================================================================== */
/* 批量操作下拉 + 应用按钮在左，搜索框 + 筛选按钮在右；空间不够时整块换到下一行，
   而不是把按钮压扁 / 让文字折行 */
.typecho-list-operate {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
    margin: 14px 0;
}

.typecho-list-operate select,
.typecho-list-operate .btn { height: 34px; }

.typecho-list-operate input,
.typecho-list-operate button,
.typecho-list-operate select,
.typecho-list-operate label { vertical-align: middle; white-space: nowrap; }

.typecho-list-operate input.text,
.typecho-list-operate .text { min-width: 140px; }

.typecho-pager li a {
    padding: 0 12px;
    border-radius: var(--qy-radius-sm);
    color: var(--qy-text-2);
}

.typecho-pager li a:hover { background: var(--qy-surface-3); color: var(--qy-text); }
.typecho-pager li.current a { background: var(--qy-primary); color: #fff; }

/* 设置页选项卡：数量多时换行排列，不横向溢出、不被裁掉 */
.typecho-option-tabs {
    display: flex;
    flex-wrap: wrap;
    row-gap: 6px;
}

.typecho-option-tabs li a {
    height: 32px;
    white-space: nowrap;
    color: var(--qy-text-2);
    background: var(--qy-surface);
    border: 1px solid var(--qy-border);
    border-radius: var(--qy-radius-sm);
}

.typecho-option-tabs li:first-child a { border-radius: var(--qy-radius-sm) 0 0 var(--qy-radius-sm); }
.typecho-option-tabs li:last-child a { border-radius: 0 var(--qy-radius-sm) var(--qy-radius-sm) 0; }
.typecho-option-tabs li a:hover { background: var(--qy-surface-2); color: var(--qy-text); }
.typecho-option-tabs li.current a,
.typecho-option-tabs li.active a { background: var(--qy-primary-soft); color: var(--qy-primary); }

/* ==========================================================================
   13. 设置项卡片（插件设置 / 系统设置）
   ========================================================================== */
.typecho-option {
    margin: 0 0 12px;
    padding: 16px 18px;
    background: var(--qy-surface);
    border: 1px solid var(--qy-border);
    border-radius: var(--qy-radius);
    box-shadow: var(--qy-shadow-sm);
}

.typecho-option label.typecho-label {
    display: block;
    margin: 0 0 8px;
    font-size: 14px;
    font-weight: 600;
    color: var(--qy-text);
}

.typecho-option label.required:after { content: " *"; color: var(--qy-danger); }

.typecho-option .description {
    margin: 8px 0 0;
    font-size: 12.5px;
    line-height: 1.75;
    color: var(--qy-muted);
    /* 说明里常带长路径 / 长 URL，不允许撑破卡片 */
    overflow-wrap: anywhere;
}

.typecho-option .description code {
    padding: 1px 6px;
    border-radius: 4px;
    background: var(--qy-surface-3);
    color: var(--qy-primary);
    font-size: 12px;
    overflow-wrap: anywhere;
    word-break: normal;
}

.typecho-option .multiline { margin: 6px 0; }

.typecho-option-submit {
    margin: 18px 0 0;
    padding: 0;
    background: transparent;
    border: none;
    box-shadow: none;
}

.typecho-option-submit button[type=submit] {
    width: auto;
    min-width: 168px;
    height: 46px;
    line-height: 44px;
    padding: 0 28px;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    background: var(--qy-primary);
    border: 1px solid var(--qy-primary);
    border-radius: var(--qy-radius-sm);
    cursor: pointer;
    box-shadow: 0 8px 20px var(--qy-primary-soft);
}

.typecho-option-submit button[type=submit]:hover {
    background: var(--qy-primary-hover);
    border-color: var(--qy-primary-hover);
}

/* ==========================================================================
   14. 登录页
   ========================================================================== */
html[data-qy-login="on"] body.body-100 {
    min-height: 100vh;
    background: var(--qy-bg);
}

html[data-qy-login="on"] body.body-100::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(58vw 44vw at 10% 6%, var(--qy-primary-soft), transparent 62%),
        radial-gradient(46vw 40vw at 92% 94%, var(--qy-primary-soft), transparent 62%);
}

html[data-qy-login="on"] body.body-100 .typecho-login-wrap {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 100vh;
    margin: 0;
    padding: 28px;
    box-sizing: border-box;
}

html[data-qy-login="on"] body.body-100 .typecho-login {
    display: block;
    width: 100%;
    max-width: 392px;
    padding: 36px 32px 26px;
    text-align: left;
    vertical-align: baseline;
    background: var(--qy-surface);
    border: 1px solid var(--qy-border);
    border-radius: 18px;
    box-shadow: var(--qy-shadow-lg);
}

html[data-qy-login="on"] body.body-100 .typecho-login h1 {
    margin: 0 0 4px;
    height: auto;
    text-align: center;
}

html[data-qy-login="on"] body.body-100 .typecho-login h1 a.i-logo {
    display: inline-block;
    width: auto;
    height: auto;
    font-size: 0;
    line-height: 0;
    text-indent: 0;
    background-image: none;
    opacity: 1;
}

html[data-qy-login="on"] body.body-100 .typecho-login h1 a.i-logo::after {
    content: var(--qy-brand, "奇营科技");
    display: block;
    font-size: 23px;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: 3px;
    color: var(--qy-text);
}

html[data-qy-login="on"] body.body-100 .typecho-login h1::after {
    content: "博客管理后台";
    display: block;
    margin-top: 4px;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 5px;
    text-align: center;
    color: var(--qy-muted);
}

html[data-qy-login="on"] body.body-100 .typecho-login form { margin-top: 26px; }
html[data-qy-login="on"] body.body-100 .typecho-login form p { margin: 0 0 14px; }

html[data-qy-login="on"] body.body-100 .typecho-login .text-l {
    padding: 13px 14px;
    font-size: 14px;
    background: var(--qy-surface-2);
    border-radius: 10px;
}

html[data-qy-login="on"] body.body-100 .typecho-login .text-l:focus { background: var(--qy-surface); }

html[data-qy-login="on"] body.body-100 .typecho-login .submit { margin: 22px 0 0; }

html[data-qy-login="on"] body.body-100 .typecho-login .btn-l {
    height: 48px;
    line-height: 46px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 2px;
    border-radius: 10px;
    box-shadow: 0 8px 20px var(--qy-primary-soft);
}

html[data-qy-login="on"] body.body-100 .typecho-login label { color: var(--qy-muted); font-size: 12.5px; }

html[data-qy-login="on"] body.body-100 .typecho-login .more-link {
    margin-top: 20px;
    padding-top: 16px;
    text-align: center;
    color: var(--qy-muted);
    border-top: 1px dashed var(--qy-border);
}

html[data-qy-login="on"] body.body-100 .typecho-login .more-link a {
    color: var(--qy-primary);
    text-decoration: none;
}

html[data-qy-login="on"] body.body-100 .typecho-login .more-link a:hover { text-decoration: underline; }

/* ==========================================================================
   15. 后台首页数据卡片
   ========================================================================== */
/* .container 在原生栅格里是 display:flex，子项默认收缩，需显式占满整行 */
.qy-dash { flex: 0 0 100%; max-width: 100%; margin: 0 0 18px; }

/* 6 张卡片固定排成 3 列 / 2 行（桌面 3 列，超宽屏 6 列 1 行，手机 2 列 3 行），
   避免 auto-fit 出现 4+2 这种最后一行被拉宽的参差排布 */
.qy-dash-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

@media (min-width: 1200px) {
    .qy-dash-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

/* 仅用于数据概览拉取失败时的提示（正常加载走上面的骨架屏） */
.qy-dash-skeleton {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 96px;
    padding: 22px;
    text-align: center;
    font-size: 13px;
    color: var(--qy-muted);
    background: var(--qy-surface);
    border: 1px dashed var(--qy-border);
    border-radius: var(--qy-radius);
}

/* 骨架屏：6 张卡片 + 2 个面板，条高按真实卡片的行高取值（标签行 18px、
   数字行 32px + 6px 间距），数据回来后高度基本一致，页面不跳。
   手机端卡片是图标在上、居中布局，用 bar-i 补出图标位（桌面端图标是绝对定位，不占高度）。 */
.qy-dash-ph { pointer-events: none; box-shadow: none; }
.qy-dash-ph span { display: block; border-radius: 6px; background: var(--qy-surface-3); }
.qy-dash-ph .bar-i { display: none; }
.qy-dash-ph .bar-s { width: 58px; height: 18px; }
.qy-dash-ph .bar-l { width: 44px; height: 32px; margin-top: 6px; }
.qy-dash-panel.qy-dash-ph { height: 260px; }

@media (max-width: 767px) {
    .qy-dash-ph .bar-i {
        display: block;
        order: -1;
        width: 34px;
        height: 34px;
        margin-bottom: 8px;
        border-radius: 10px;
    }
}

.qy-dash-card {
    position: relative;
    display: block;
    padding: 16px 18px 15px;
    text-decoration: none;
    background: var(--qy-surface);
    border: 1px solid var(--qy-border);
    border-radius: var(--qy-radius);
    box-shadow: var(--qy-shadow-sm);
    transition: box-shadow .18s ease, border-color .18s ease;
}

/* 悬停只换阴影/描边，不做位移：鼠标划过时卡片整体上下跳动也是"晃动" */
.qy-dash-card:hover,
.qy-dash-card:focus {
    text-decoration: none;
    border-color: var(--qy-primary-line);
    box-shadow: var(--qy-shadow);
}

.qy-dash-label {
    display: block;
    padding-right: 42px;
    font-size: 12.5px;
    color: var(--qy-muted);
}

.qy-dash-num {
    display: block;
    margin-top: 6px;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -.5px;
    color: var(--qy-text);
    font-variant-numeric: tabular-nums;
}

.qy-dash-icon {
    position: absolute;
    top: 14px;
    right: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    color: var(--qy-primary);
    background: var(--qy-primary-soft);
    border-radius: 10px;
}

.qy-dash-icon svg { width: 18px; height: 18px; display: block; }

.qy-dash-badge {
    position: absolute;
    right: 16px;
    bottom: 15px;
    padding: 2px 9px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
    background: var(--qy-warning);
    border-radius: 20px;
}

.qy-dash-panel {
    margin-top: 16px;
    background: var(--qy-surface);
    border: 1px solid var(--qy-border);
    border-radius: var(--qy-radius);
    box-shadow: var(--qy-shadow-sm);
    overflow: hidden;
}

.qy-dash-panel > h3 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    padding: 14px 18px;
    font-size: 14px;
    font-weight: 600;
    color: var(--qy-text);
    border-bottom: 1px solid var(--qy-border);
}

.qy-dash-panel > h3 a { font-size: 12px; font-weight: 500; text-decoration: none; }

.qy-dash-list { list-style: none; margin: 0; padding: 6px 0; }

.qy-dash-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 18px;
    font-size: 13.5px;
}

.qy-dash-list li + li { border-top: 1px solid var(--qy-border); }
.qy-dash-list li:hover { background: var(--qy-surface-2); }

.qy-dash-list a {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-decoration: none;
    color: var(--qy-text-2);
}

.qy-dash-list a:hover { color: var(--qy-primary); }
.qy-dash-list time { flex: 0 0 auto; font-size: 12px; color: var(--qy-muted); }

.qy-dash-tag {
    flex: 0 0 auto;
    padding: 1px 7px;
    font-size: 11px;
    color: var(--qy-muted);
    background: var(--qy-surface-2);
    border: 1px solid var(--qy-border);
    border-radius: 6px;
}

.qy-dash-tag.is-public { color: var(--qy-primary); background: var(--qy-primary-soft); border-color: transparent; }

/* 最近文章 / 最近评论 双面板 */
.qy-dash-panels {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 16px;
}

.qy-dash-panels .qy-dash-panel { margin-top: 0; }

/* 插件数据卡片接管概要后，隐藏原生「最近发布的文章 / 最近得到的回复 / 官方最新日志」 */
html[data-qy-dash="1"] .typecho-dashboard .typecho-page-main > div:nth-of-type(2),
html[data-qy-dash="1"] .typecho-dashboard .typecho-page-main > div:nth-of-type(3),
html[data-qy-dash="1"] .typecho-dashboard .typecho-page-main > div:nth-of-type(4) { display: none; }

/* 手机端：卡片一行两个、内容居中 */
@media (max-width: 767px) {
    .qy-dash-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }

    .qy-dash-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 14px 10px 12px;
    }

    .qy-dash-icon { position: static; order: -1; margin-bottom: 8px; }
    .qy-dash-label { padding-right: 0; }
    .qy-dash-num { margin-top: 4px; font-size: 24px; }
    .qy-dash-badge { position: static; margin-top: 8px; }

    .qy-dash-panels { grid-template-columns: 1fr; }
}

/* 手机端菜单手风琴 / 抽屉样式已统一并入第 4 节（lovestu 风格） */

/* ==========================================================================
   16. 编辑器增强 / 沉浸写作
   ========================================================================== */
.typecho-post-area input.title {
    padding: 10px 12px;
    font-size: 18px;
    font-weight: 600;
}

.typecho-post-area #text {
    padding: 14px;
    font-size: 14px;
    line-height: 1.85;
    border-radius: var(--qy-radius-sm);
}

.typecho-post-area #custom-field,
.typecho-post-area #edit-secondary {
    background: var(--qy-surface);
    border: 1px solid var(--qy-border);
    border-radius: var(--qy-radius);
    box-shadow: var(--qy-shadow-sm);
}

#auto-save-message {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: 6px;
    font-size: 12.5px;
    color: var(--qy-muted);
}

#auto-save-message::before {
    content: "";
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #c8ced8;
}

#auto-save-message.qy-saving::before { background: var(--qy-warning); animation: qy-pulse 1s ease-in-out infinite; }
#auto-save-message.qy-saved::before { background: var(--qy-success); }
#auto-save-message.qy-dirty::before { background: var(--qy-danger); }

@keyframes qy-pulse {
    0%, 100% { opacity: .3; }
    50% { opacity: 1; }
}

.qy-word-count {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-left: 6px;
    font-size: 12.5px;
    color: var(--qy-muted);
}

.qy-word-count b {
    font-weight: 600;
    color: var(--qy-text-2);
    font-variant-numeric: tabular-nums;
}

#qy-zen-exit {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 2000;
    display: none;
    box-shadow: var(--qy-shadow);
}

html.qy-zen body { padding-top: 0 !important; padding-left: 0 !important; }
html.qy-zen .typecho-head-nav { display: none !important; }
html.qy-zen .typecho-page-title,
html.qy-zen #edit-secondary { display: none; }
html.qy-zen .container { padding-left: 26px; padding-right: 26px; }
html.qy-zen .typecho-post-area #text { min-height: 68vh; }
html.qy-zen #qy-zen-exit { display: inline-block; }

/* 撰写页提交区：预览 / 保存草稿 / 发布 / 沉浸写作 始终单行排列，按钮文字不折行 */
.typecho-post-area .submit .btn,
.typecho-post-area .submit .qy-word-count {
    white-space: nowrap;
    flex-shrink: 0;
}

@media (max-width: 767px) {
    /* 手机端收紧按钮内边距与间距，保证一行放下 */
    .typecho-post-area .submit .btn { padding: 0 9px; font-size: 13px; }
    .typecho-post-area .submit .btn i { display: none; }
    .typecho-post-area .submit .right > * { margin-left: 5px; }
    .typecho-post-area .submit .left > * { margin-right: 5px; }
}

@media (max-width: 575px) {
    /* 极小屏隐藏字数统计，确保按钮完整单行 */
    .typecho-post-area .submit .qy-word-count { display: none; }
}

/* ==========================================================================
   17. 撰写 / 编辑页修正
   ========================================================================== */
/* Typecho 原生 `.typecho-post-area .description { margin-top: -.5em }` 用负边距
   收紧说明文字间距；QYAdmin 加高输入框后，它会让说明文字压住输入框底部（约 6px），
   这里改为正向间距，自定义字段的说明文字与输入框彻底分离。 */
.typecho-post-area .description { margin-top: 6px; }

/* 窄窗口（600–767px，如内置浏览器 PC 模式）保持撰写页左右双栏：
   核心栅格 col-tb-* 在 768px 才生效，低于此宽度右侧面板会整列掉到编辑器下方，
   需滚过整个编辑器才能看到「发布 / 选项」。这里给定栏宽右栏 + 自适应主栏。 */
@media (min-width: 600px) and (max-width: 767px) {
    form.typecho-post-area > [role="main"] { flex: 0 0 calc(100% - 240px); max-width: calc(100% - 240px); }
    form.typecho-post-area > [role="complementary"] { flex: 0 0 240px; max-width: 240px; }
}

/* 双栏状态下右侧选项面板吸顶：编辑器很长，向下滚动找「发布」按钮时
   选项面板保持可见；align-self 取消 flex 拉伸，sticky 才有活动空间。 */
@media (min-width: 600px) {
    form.typecho-post-area > [role="complementary"] {
        align-self: flex-start;
        position: sticky;
        top: calc(var(--qy-nav-h) + 12px);
    }
}

/* ==========================================================================
   18. 手机端适配（≤767px / ≤575px）
   ========================================================================== */
/* 奇营插件设置页：桌面端只显示当前选项卡分组，分组标题条隐藏 */
.qys-settings .qys-sec { display: none; }
.qys-settings .qys-sec.current { display: block; }
.qys-settings .qys-sec-head { display: none; }

@media (max-width: 767px) {
    /* 奇营插件设置页：改为一页可折叠手风琴 */
    .qys-settings .qys-nav { display: none; }

    .qys-settings .qys-sec {
        display: block;
        margin: 0 0 10px;
        background: var(--qy-surface);
        border: 1px solid var(--qy-border);
        border-radius: var(--qy-radius);
        box-shadow: var(--qy-shadow-sm);
        overflow: hidden;
    }

    .qys-settings .qys-sec-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 0;
        padding: 13px 14px;
        font-size: 14px;
        font-weight: 600;
        color: var(--qy-text);
        cursor: pointer;
        -webkit-user-select: none;
        user-select: none;
    }

    .qys-settings .qys-sec-arrow {
        flex: 0 0 auto;
        color: var(--qy-muted);
        transition: transform .2s ease;
    }

    .qys-settings .qys-sec.open .qys-sec-head {
        color: var(--qy-primary);
        border-bottom: 1px solid var(--qy-border);
    }

    .qys-settings .qys-sec.open .qys-sec-arrow { transform: rotate(180deg); }

    .qys-settings .qys-sec-body { display: none; padding: 12px 12px 4px; }
    .qys-settings .qys-sec.open .qys-sec-body { display: block; }

    /* 卡片内的设置项改浅色底，避免双层白卡 */
    .qys-settings .qys-sec-body .typecho-option {
        margin: 0 0 10px;
        padding: 12px;
        background: var(--qy-surface-2);
        box-shadow: none;
    }

    .qys-settings .qys-sec-body .typecho-option-submit { margin-top: 10px; }

    /* 表单：字号 16px 避免 iOS 聚焦自动放大，触控高度加大 */
    input[type=text],
    input[type=url],
    input[type=password],
    input[type=email],
    input[type=number],
    input[type=search],
    input[type=tel],
    textarea,
    select { font-size: 16px; }

    input[type=text],
    input[type=url],
    input[type=password],
    input[type=email],
    input[type=number],
    input[type=search],
    input[type=tel] { min-height: 42px; }

    select { height: 42px; }

    .btn { min-height: 40px; line-height: 38px; }

    /* 撰写页自定义字段：字段名 / 字段值整行堆叠，输入框占满整行。
       必须先让 .field 由横排改为竖排——原来只写了 width:100%，父级仍是 flex 横排，
       两个 100% 的子项被压缩到各占一半，说明文字被挤成竖条折行。 */
    .typecho-post-area .fields .field { flex-flow: column; }
    .typecho-post-area .fields .field-name,
    .typecho-post-area .fields .field-value { width: 100%; }
    .typecho-post-area .fields .field-name { display: flex; margin-right: 0; }
    .typecho-post-area .fields .field-value { margin-left: 0; margin-top: 8px; }

    /* .field-value 原生是 flex，其内部包裹的 div 会按内容收缩，
       导致同页各输入框宽度参差不齐；强制该 div 撑满整行，输入框才能真正 100% */
    .typecho-post-area .fields .field .field-value > div { width: 100%; }

    /* 下拉/输入控件不因内容（如超长选项文字）而撑破窄屏 */
    input,
    textarea,
    select { max-width: 100%; }

    .typecho-post-area .field-value input.text,
    .typecho-post-area .field-value input[type=text],
    .typecho-post-area .field-value input[type=url],
    .typecho-post-area .field-value input[type=number],
    .typecho-post-area .field-value select,
    .typecho-post-area .field-value textarea { width: 100%; }

    /* 字段名等宽字体在窄屏下可读性差，恢复常规字体 */
    .typecho-post-area .fields.mono { font-family: inherit; }

    /* 编辑器容器限宽，避免内部元素撑破页面 */
    .typecho-post-area .editormd,
    .typecho-post-area #qytool-editormd { max-width: 100%; }

    /* 列表表格：单元格内边距收窄，给内容更多空间 */
    .typecho-list-table th,
    .typecho-list-table td { padding: 10px 12px; }

    /* 恢复文章 / 页面 / 分类等列表的勾选列（原生 kit-hidden-mb 在 ≤575px 隐藏了它） */
    .typecho-list-table td.kit-hidden-mb:has(> input[type="checkbox"]),
    .typecho-list-table th.kit-hidden-mb:has(input[type="checkbox"]) { display: table-cell; }
}

@media (max-width: 575px) {
    /* 设置项卡片内边距收窄 */
    .typecho-option { padding: 14px 14px; }

    /* 提交按钮占满整行，便于单手操作 */
    .typecho-option-submit button[type=submit] { width: 100%; min-width: 0; }
}