/* ============================================================
   招聘求职中心 —— 一体化招聘门户设计系统
   文件：assets/css/jobs.css
   作用域：全部使用 lsj- 前缀，不依赖 Tailwind，FTP 上传即生效。
   风格：专业稳重商务蓝 · 薪资红 · 热门琥珀 · 高密度信息 · 移动端类 APP。
   ============================================================ */

:root {
    --lsj-primary: #1f4fb0;
    --lsj-primary-dark: #173b85;
    --lsj-primary-soft: rgba(31, 79, 176, .08);
    --lsj-primary-line: rgba(31, 79, 176, .18);
    --lsj-hot: #e23b3b;          /* 薪资 / 紧急：中国招聘惯例用红 */
    --lsj-hot-soft: rgba(226, 59, 59, .08);
    --lsj-hot-line: rgba(226, 59, 59, .28);
    --lsj-amber: #e8920a;        /* 热门标签 */
    --lsj-amber-soft: rgba(232, 146, 10, .10);
    --lsj-bg: #f4f6fa;
    --lsj-card: #ffffff;
    --lsj-text: #1a2230;
    --lsj-sub: #5a6577;
    --lsj-mute: #94a0b3;
    --lsj-border: #e9edf3;
    --lsj-border-strong: #dde3ec;
    --lsj-tag-bg: #f1f4f9;
    --lsj-tag-text: #5a6577;
    --lsj-radius: 16px;
    --lsj-radius-sm: 12px;
    --lsj-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 8px 22px rgba(16, 24, 40, .05);
    --lsj-shadow-hover: 0 6px 18px rgba(23, 59, 133, .12), 0 16px 40px rgba(16, 24, 40, .08);
}

/* ---------- 容器 ---------- */
.lsj-app {
    background: var(--lsj-bg);
    min-height: 60vh;
    padding: 28px 0 64px;
}
.lsj-wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
@media (max-width: 640px) {
    .lsj-app { padding: 16px 0 96px; }
    .lsj-wrap { padding: 0 14px; }
}

/* ---------- 顶部 Hero ---------- */
.lsj-head {
    position: relative;
    background:
        radial-gradient(120% 140% at 100% 0%, rgba(31, 79, 176, .10), transparent 55%),
        linear-gradient(135deg, #ffffff, #f7f9fd);
    border: 1px solid var(--lsj-border);
    border-radius: var(--lsj-radius);
    padding: 26px 28px 28px;
    box-shadow: var(--lsj-shadow);
    overflow: hidden;
}
.lsj-head-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}
.lsj-head-left { flex: 1 1 420px; min-width: 0; }
.lsj-bread {
    font-size: 12px;
    letter-spacing: 1.5px;
    color: var(--lsj-primary);
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.lsj-head h1 {
    font-size: 28px;
    font-weight: 800;
    color: var(--lsj-text);
    margin: 0 0 8px;
    letter-spacing: .5px;
}
.lsj-sub {
    font-size: 14px;
    line-height: 1.7;
    color: var(--lsj-sub);
    margin: 0 0 18px;
    max-width: 640px;
}
.lsj-stat-row { display: flex; gap: 30px; flex-wrap: wrap; }
.lsj-stat b {
    display: block;
    font-size: 22px;
    font-weight: 800;
    color: var(--lsj-primary);
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
}
.lsj-stat span { font-size: 12.5px; color: var(--lsj-mute); margin-top: 2px; display: block; }
.lsj-stat--hot b { color: var(--lsj-hot); }

.lsj-head-cta { display: flex; flex-direction: column; gap: 10px; flex-shrink: 0; }
.lsj-btn {
    display: inline-flex; align-items: center; gap: 7px;
    padding: 11px 20px; border-radius: 999px;
    font-size: 14px; font-weight: 700; text-decoration: none;
    transition: transform .15s, box-shadow .15s, background .15s, color .15s;
    white-space: nowrap;
}
.lsj-btn svg { width: 17px; height: 17px; }
.lsj-btn-solid { background: var(--lsj-primary); color: #fff; box-shadow: 0 6px 16px rgba(31, 79, 176, .25); }
.lsj-btn-solid:hover { background: var(--lsj-primary-dark); transform: translateY(-1px); }
.lsj-btn-ghost { background: #fff; color: var(--lsj-primary); border: 1px solid var(--lsj-primary-line); }
.lsj-btn-ghost:hover { background: var(--lsj-primary-soft); transform: translateY(-1px); }

/* ---------- 搜索栏 ---------- */
.lsj-search {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid var(--lsj-border-strong);
    border-radius: 999px;
    padding: 7px 7px 7px 18px;
    margin-top: 20px;
    box-shadow: var(--lsj-shadow);
    transition: border-color .18s, box-shadow .18s;
}
.lsj-search:focus-within {
    border-color: var(--lsj-primary);
    box-shadow: 0 0 0 3px var(--lsj-primary-soft);
}
.lsj-search-ico { color: var(--lsj-primary); opacity: .8; flex-shrink: 0; display: inline-flex; }
.lsj-search input[type="text"] {
    flex: 1; min-width: 0; border: 0; outline: 0; background: transparent;
    font-size: 14.5px; color: var(--lsj-text); padding: 9px 0;
}
.lsj-search input::placeholder { color: var(--lsj-mute); }
.lsj-search button {
    flex-shrink: 0; border: 0; cursor: pointer;
    background: var(--lsj-primary); color: #fff;
    font-size: 14px; font-weight: 700; letter-spacing: 2px;
    padding: 10px 26px; border-radius: 999px;
    transition: background .18s;
}
.lsj-search button:hover { background: var(--lsj-primary-dark); }

/* ---------- 类型 Tab ---------- */
.lsj-tabs {
    display: flex; gap: 4px; margin: 20px 0 14px;
    border-bottom: 1px solid var(--lsj-border);
    overflow-x: auto; scrollbar-width: none;
}
.lsj-tabs::-webkit-scrollbar { display: none; }
.lsj-tab {
    position: relative; flex-shrink: 0; padding: 12px 16px 14px;
    font-size: 15px; font-weight: 700; color: var(--lsj-sub);
    text-decoration: none; white-space: nowrap; transition: color .15s;
}
.lsj-tab:hover { color: var(--lsj-text); }
.lsj-tab::after {
    content: ''; position: absolute; left: 16px; right: 16px; bottom: -1px;
    height: 3px; border-radius: 3px 3px 0 0; background: transparent; transition: background .15s;
}
.lsj-tab.is-active { color: var(--lsj-primary); }
.lsj-tab.is-active::after { background: var(--lsj-primary); }

/* ---------- 职位分类导航栏 ---------- */
.lsj-catnav {
    background: var(--lsj-card); border: 1px solid var(--lsj-border);
    border-radius: var(--lsj-radius); padding: 16px 18px 18px; margin-bottom: 18px;
    box-shadow: var(--lsj-shadow);
}
.lsj-catnav-head {
    display: flex; align-items: center; gap: 8px;
    font-size: 14px; font-weight: 700; color: var(--lsj-text); margin-bottom: 13px;
}
.lsj-catnav-head svg { color: var(--lsj-primary); }
.lsj-catnav-grid {
    display: grid; gap: 9px;
    grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
}
.lsj-cat {
    display: flex; align-items: center; justify-content: space-between; gap: 6px;
    padding: 10px 12px; border-radius: 10px; text-decoration: none;
    background: var(--lsj-tag-bg); border: 1px solid transparent;
    transition: all .15s;
}
.lsj-cat:hover { background: #fff; border-color: var(--lsj-primary-line); transform: translateY(-1px); }
.lsj-cat-name { font-size: 13.5px; color: var(--lsj-text); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lsj-cat-count { font-size: 11.5px; color: var(--lsj-mute); background: #fff; border-radius: 999px; padding: 1px 7px; flex-shrink: 0; }
.lsj-cat.is-active { background: var(--lsj-primary); border-color: var(--lsj-primary); }
.lsj-cat.is-active .lsj-cat-name { color: #fff; }
.lsj-cat.is-active .lsj-cat-count { color: var(--lsj-primary); background: rgba(255, 255, 255, .9); }

/* ---------- 内容区块（热门 / 最新 / 企业 / 资讯） ---------- */
.lsj-block { margin-bottom: 24px; }
.lsj-block-head {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 14px; gap: 12px;
}
.lsj-block-title {
    display: flex; align-items: center; gap: 9px;
    font-size: 18px; font-weight: 800; color: var(--lsj-text); margin: 0;
}
.lsj-block-title svg { color: var(--lsj-primary); }
.lsj-block-more {
    font-size: 13px; color: var(--lsj-sub); text-decoration: none; font-weight: 600; white-space: nowrap;
    transition: color .15s;
}
.lsj-block-more:hover { color: var(--lsj-primary); }

/* 职位网格 */
.lsj-job-grid { display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 880px) { .lsj-job-grid { grid-template-columns: 1fr 1fr; gap: 16px; } }

/* 企业展示网格 */
.lsj-co-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
@media (min-width: 720px) { .lsj-co-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1040px) { .lsj-co-grid { grid-template-columns: repeat(4, 1fr); } }
.lsj-co-card {
    display: flex; gap: 12px; align-items: center; text-decoration: none; color: inherit;
    background: var(--lsj-card); border: 1px solid var(--lsj-border);
    border-radius: var(--lsj-radius-sm); padding: 14px; transition: border-color .16s, box-shadow .16s, transform .16s;
}
.lsj-co-card:hover { border-color: var(--lsj-primary-line); box-shadow: var(--lsj-shadow-hover); transform: translateY(-2px); }
.lsj-co-logo {
    width: 46px; height: 46px; border-radius: 12px; background: var(--lsj-tag-bg);
    color: var(--lsj-primary); display: flex; align-items: center; justify-content: center;
    font-size: 18px; font-weight: 800; flex-shrink: 0; overflow: hidden;
}
.lsj-co-logo img { width: 100%; height: 100%; object-fit: cover; }
.lsj-co-info { min-width: 0; }
.lsj-co-name { font-size: 14.5px; font-weight: 700; color: var(--lsj-text); display: flex; align-items: center; gap: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lsj-co-meta { font-size: 12.5px; color: var(--lsj-sub); margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lsj-co-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }

/* 行业资讯 */
.lsj-news { list-style: none; margin: 0; padding: 0; background: var(--lsj-card); border: 1px solid var(--lsj-border); border-radius: var(--lsj-radius); overflow: hidden; }
.lsj-news-item + .lsj-news-item { border-top: 1px solid var(--lsj-border); }
.lsj-news-link { display: block; padding: 13px 16px; text-decoration: none; transition: background .15s; }
.lsj-news-link:hover { background: var(--lsj-bg); }
.lsj-news-title { display: block; font-size: 14.5px; font-weight: 600; color: var(--lsj-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: color .15s; }
.lsj-news-link:hover .lsj-news-title { color: var(--lsj-primary); }
.lsj-news-meta { display: flex; gap: 10px; align-items: baseline; margin-top: 4px; }
.lsj-news-date { font-size: 12px; color: var(--lsj-mute); flex-shrink: 0; font-variant-numeric: tabular-nums; }
.lsj-news-desc { font-size: 12.5px; color: var(--lsj-sub); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- 子筛选 chips ---------- */
.lsj-filters { display: flex; gap: 7px; margin-bottom: 16px; overflow-x: auto; scrollbar-width: none; }
.lsj-filters::-webkit-scrollbar { display: none; }
.lsj-chip {
    flex-shrink: 0; padding: 7px 14px; font-size: 13px; color: var(--lsj-sub);
    background: #fff; border: 1px solid var(--lsj-border); border-radius: 999px;
    text-decoration: none; white-space: nowrap; transition: all .15s;
}
.lsj-chip:hover { color: var(--lsj-text); border-color: var(--lsj-border-strong); }
.lsj-chip.is-active { color: #fff; background: var(--lsj-primary); border-color: var(--lsj-primary); }

/* ---------- 主体布局 ---------- */
.lsj-body { display: flex; gap: 24px; align-items: flex-start; }
.lsj-main { flex: 1 1 auto; min-width: 0; }
.lsj-side { width: 304px; flex: 0 0 304px; }

.lsj-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.lsj-count { font-size: 13.5px; color: var(--lsj-sub); }
.lsj-count b { color: var(--lsj-text); font-weight: 800; }

/* ---------- 卡片列表 ---------- */
.lsj-list { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 1180px) { .lsj-list { grid-template-columns: 1fr 1fr; gap: 14px; } }

.lsj-card {
    position: relative; overflow: hidden;
    display: block; background: var(--lsj-card);
    border: 1px solid var(--lsj-border); border-radius: var(--lsj-radius-sm);
    padding: 16px 18px; text-decoration: none; color: inherit;
    transition: border-color .16s, box-shadow .16s, transform .16s;
}
.lsj-card:hover { border-color: var(--lsj-primary-line); box-shadow: var(--lsj-shadow-hover); transform: translateY(-2px); }

/* 职位卡片 */
.lsj-job { display: flex; gap: 14px; }
.lsj-logo {
    width: 46px; height: 46px; border-radius: 12px; background: var(--lsj-tag-bg);
    color: var(--lsj-primary); display: flex; align-items: center; justify-content: center;
    font-size: 18px; font-weight: 800; flex-shrink: 0; overflow: hidden;
}
.lsj-logo img { width: 100%; height: 100%; object-fit: cover; }
.lsj-job-main { flex: 1; min-width: 0; }
.lsj-job-top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.lsj-job-title { font-size: 15.5px; font-weight: 700; color: var(--lsj-text); margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lsj-job:hover .lsj-job-title { color: var(--lsj-primary); }
.lsj-job-pay { text-align: right; flex-shrink: 0; }
.lsj-job-salary { display: block; font-size: 16px; font-weight: 800; color: var(--lsj-hot); line-height: 1.2; font-variant-numeric: tabular-nums; }
.lsj-job-date { display: block; font-size: 11.5px; color: var(--lsj-mute); margin-top: 3px; }
.lsj-job-meta { font-size: 12.5px; color: var(--lsj-sub); margin-top: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lsj-job-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }

/* 热门 / 急招 标识 */
.lsj-job.is-hot { border-color: var(--lsj-hot-line); background: linear-gradient(180deg, var(--lsj-hot-soft), #fff 60%); }
.lsj-ribbon {
    position: absolute; top: 0; right: 0;
    background: var(--lsj-hot); color: #fff; font-size: 11px; font-weight: 700;
    padding: 3px 10px; border-bottom-left-radius: 10px; letter-spacing: .5px;
}

/* 任务卡片 */
.lsj-task .lsj-job-salary { color: var(--lsj-amber); }

/* 标签 */
.lsj-tag {
    font-size: 11.5px; color: var(--lsj-tag-text); background: var(--lsj-tag-bg);
    border-radius: 6px; padding: 3px 8px; white-space: nowrap;
}
.lsj-tag--primary { color: var(--lsj-primary); background: var(--lsj-primary-soft); }
.lsj-tag--green { color: #0f9d58; background: rgba(15, 157, 88, .10); }
.lsj-tag--blue { color: #2563eb; background: rgba(37, 99, 235, .10); }
.lsj-tag--purple { color: #7c3aed; background: rgba(124, 58, 237, .10); }
.lsj-tag--orange { color: #e8730c; background: rgba(232, 115, 12, .10); }

/* 企业卡片 */
.lsj-company { display: flex; gap: 13px; align-items: flex-start; }
.lsj-company .lsj-logo { width: 48px; height: 48px; border-radius: 13px; }
.lsj-company-name { font-size: 15.5px; font-weight: 700; color: var(--lsj-text); margin: 0; display: flex; align-items: center; gap: 6px; }
.lsj-company:hover .lsj-company-name { color: var(--lsj-primary); }
.lsj-company-meta { font-size: 12.5px; color: var(--lsj-sub); margin-top: 4px; }
.lsj-verified { display: inline-block; font-size: 11px; color: #fff; background: var(--lsj-primary); border-radius: 6px; padding: 1px 7px; font-weight: 600; }
.lsj-company-site { font-size: 12px; color: var(--lsj-primary); text-decoration: none; white-space: nowrap; flex-shrink: 0; align-self: center; }

/* 简历卡片 */
.lsj-resume { display: flex; gap: 13px; align-items: flex-start; }
.lsj-avatar {
    width: 46px; height: 46px; border-radius: 50%; background: var(--lsj-primary-soft);
    color: var(--lsj-primary); display: flex; align-items: center; justify-content: center;
    font-size: 18px; font-weight: 800; flex-shrink: 0;
}
.lsj-resume-name { font-size: 15.5px; font-weight: 700; color: var(--lsj-text); margin: 0; }
.lsj-resume:hover .lsj-resume-name { color: var(--lsj-primary); }
.lsj-resume-pay { font-size: 14.5px; font-weight: 800; color: #7c3aed; text-align: right; flex-shrink: 0; }

/* ---------- 侧边栏 ---------- */
.lsj-panel {
    background: var(--lsj-card); border: 1px solid var(--lsj-border);
    border-radius: var(--lsj-radius-sm); padding: 16px 18px; margin-bottom: 16px;
}
.lsj-panel-title {
    font-size: 14.5px; font-weight: 800; color: var(--lsj-text); margin: 0 0 12px;
    display: flex; align-items: center; gap: 8px;
}
.lsj-panel-title::before { content: ''; width: 3px; height: 15px; border-radius: 2px; background: var(--lsj-primary); }
.lsj-side-sticky { position: sticky; top: 90px; }

/* 快捷入口 */
.lsj-quick { display: flex; flex-direction: column; gap: 2px; }
.lsj-quick-item {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 10px; border-radius: 9px; text-decoration: none;
    color: var(--lsj-sub); font-size: 13.5px; transition: background .15s, color .15s;
}
.lsj-quick-item:hover { background: var(--lsj-bg); color: var(--lsj-text); }
.lsj-quick-item b { color: var(--lsj-mute); font-weight: 700; font-size: 13px; font-variant-numeric: tabular-nums; }

/* 入驻企业 */
.lsj-co-item { display: flex; align-items: center; gap: 10px; padding: 8px; border-radius: 9px; text-decoration: none; transition: background .15s; }
.lsj-co-item:hover { background: var(--lsj-bg); }
.lsj-co-logo {
    width: 36px; height: 36px; border-radius: 10px; background: var(--lsj-tag-bg);
    color: var(--lsj-primary); display: flex; align-items: center; justify-content: center;
    font-size: 15px; font-weight: 800; flex-shrink: 0; overflow: hidden;
}
.lsj-co-logo img { width: 100%; height: 100%; object-fit: cover; }
.lsj-co-name { flex: 1; min-width: 0; font-size: 13.5px; font-weight: 700; color: var(--lsj-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lsj-co-ind { font-size: 12px; color: var(--lsj-mute); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 求职 / 招聘 CTA */
.lsj-cta {
    background: linear-gradient(135deg, var(--lsj-primary), var(--lsj-primary-dark));
    border-radius: var(--lsj-radius-sm); padding: 18px 18px; color: #fff; margin-bottom: 16px;
    box-shadow: 0 8px 22px rgba(31, 79, 176, .18);
}
.lsj-cta h4 { margin: 0 0 6px; font-size: 15px; font-weight: 800; }
.lsj-cta p { margin: 0 0 13px; font-size: 12.5px; opacity: .9; line-height: 1.6; }
.lsj-cta a {
    display: inline-block; background: #fff; color: var(--lsj-primary);
    font-size: 13.5px; font-weight: 800; padding: 9px 18px; border-radius: 999px; text-decoration: none;
    transition: transform .15s;
}
.lsj-cta a:hover { transform: translateY(-1px); }
.lsj-cta--alt {
    background: linear-gradient(135deg, #fff, #f7f9fd);
    border: 1px solid var(--lsj-border); color: var(--lsj-text); box-shadow: var(--lsj-shadow);
}
.lsj-cta--alt h4 { color: var(--lsj-text); }
.lsj-cta--alt p { color: var(--lsj-sub); opacity: 1; }
.lsj-cta--alt a { background: var(--lsj-primary); color: #fff; }

/* ---------- 分页 ---------- */
.lsj-pager { display: flex; justify-content: center; gap: 6px; margin-top: 24px; flex-wrap: wrap; }
.lsj-page {
    min-width: 36px; height: 36px; padding: 0 11px;
    display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid var(--lsj-border); border-radius: 10px;
    font-size: 13.5px; color: var(--lsj-sub); text-decoration: none; transition: all .15s;
}
.lsj-page:hover { border-color: var(--lsj-primary-line); color: var(--lsj-primary); }
.lsj-page.is-active { background: var(--lsj-primary); border-color: var(--lsj-primary); color: #fff; }

/* ---------- 空状态 ---------- */
.lsj-empty {
    text-align: center; padding: 52px 20px; color: var(--lsj-mute);
    background: var(--lsj-card); border: 1px dashed var(--lsj-border-strong); border-radius: var(--lsj-radius-sm);
}
.lsj-empty b { display: block; font-size: 15.5px; color: var(--lsj-sub); font-weight: 700; margin-bottom: 4px; }

/* ---------- 移动端：APP 化单列 + 底部导航 ---------- */
@media (max-width: 1023px) {
    .lsj-body { flex-direction: column; gap: 18px; }
    .lsj-side { width: 100%; flex: 1 1 auto; }
    .lsj-side-sticky { position: static; }
    .lsj-main { order: 1; }
    .lsj-side { order: 2; }
}
@media (max-width: 768px) {
    .lsj-head { padding: 20px 16px 22px; }
    .lsj-head-top { flex-direction: column; }
    .lsj-head h1 { font-size: 23px; }
    .lsj-head-cta { flex-direction: row; width: 100%; }
    .lsj-head-cta .lsj-btn { flex: 1; justify-content: center; }
    .lsj-stat-row { gap: 22px; }
    .lsj-stat b { font-size: 19px; }
    .lsj-search { padding-left: 15px; }
    .lsj-search button { padding: 10px 18px; letter-spacing: 1px; }
    .lsj-card { padding: 14px; }
    .lsj-logo, .lsj-resume .lsj-avatar { width: 42px; height: 42px; }
    .lsj-job-title, .lsj-company-name, .lsj-resume-name { font-size: 14.5px; }
    .lsj-job-tags { margin-top: 8px; }
    .lsj-co-grid { grid-template-columns: 1fr 1fr; }
}

/* 移动端底部导航（类 APP） */
.lsj-mnav { display: none; }
@media (max-width: 768px) {
    .lsj-mnav {
        display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 80;
        background: rgba(255, 255, 255, .96); backdrop-filter: blur(10px);
        border-top: 1px solid var(--lsj-border); box-shadow: 0 -4px 18px rgba(16, 24, 40, .08);
        padding-bottom: env(safe-area-inset-bottom, 0px);
    }
    .lsj-mnav a {
        flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px;
        padding: 9px 0 8px; text-decoration: none; color: var(--lsj-mute); font-size: 11px;
        transition: color .15s;
    }
    .lsj-mnav a svg { width: 21px; height: 21px; }
    .lsj-mnav a.is-active { color: var(--lsj-primary); font-weight: 700; }
}
