/* =====================================================
   热工室工作管理平台 - 手机版样式 v2.0
   设计风格：参考"医院/政务小程序"——白底卡片 + 蓝渐变 banner + 多色图标网格
   设计目标：清爽、扁平、信息密度适中、彩色图标易识别
   ===================================================== */

:root {
    /* 主色与多色系统 */
    --m-primary: #0074D9;
    --m-primary-dark: #0056a3;
    --m-primary-light: #4eaee8;

    --m-blue:   #0074D9;
    --m-cyan:   #14b8a6;
    --m-green:  #22c55e;
    --m-orange: #f97316;
    --m-amber:  #f59e0b;
    --m-red:    #ef4444;
    --m-purple: #8b5cf6;
    --m-pink:   #ec4899;
    --m-indigo: #6366f1;

    /* 中性色 */
    --m-bg:      #f5f7fb;
    --m-bg-soft: #eef2f8;
    --m-card:    #ffffff;
    --m-text:    #1a2434;
    --m-text-2:  #6b7588;
    --m-text-3:  #9aa4b8;
    --m-border:  #ebeef3;
    --m-divider: #f0f2f5;

    /* 圆角 */
    --m-r-sm: 10px;
    --m-r:    14px;
    --m-r-lg: 18px;
    --m-r-xl: 22px;

    /* 尺寸 */
    --m-nav-h: 56px;
    --m-banner-h: 132px;
    --m-fs-base: 14px;
}

/* =================== 基础重置 =================== */
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

html, body {
    margin: 0; padding: 0; min-height: 100%;
    background: var(--m-bg);
    color: var(--m-text);
    font-family: 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', Arial, sans-serif;
    font-size: var(--m-fs-base);
    line-height: 1.55;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
}

a { color: var(--m-primary); text-decoration: none; }
img { max-width: 100%; }

/* =================== 顶部栏（白底·安全区） =================== */
.m-topbar {
    position: sticky; top: 0; z-index: 50;
    display: flex; align-items: center; justify-content: space-between;
    height: calc(46px + env(safe-area-inset-top, 0));
    padding: env(safe-area-inset-top, 0) 14px 0;
    background: #fff;
    border-bottom: 1px solid var(--m-border);
}
.m-topbar .m-home-btn,
.m-topbar .m-action-btn {
    width: 36px; height: 36px;
    display: flex; align-items: center; justify-content: center;
    color: var(--m-text);
    font-size: 20px;
    border-radius: 50%;
}
.m-topbar .m-home-btn:active,
.m-topbar .m-action-btn:active { background: var(--m-bg-soft); }
.m-topbar .m-title {
    flex: 1; text-align: center;
    font-size: 17px; font-weight: 600; color: var(--m-text);
    margin: 0; padding: 0 8px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.m-topbar .m-avatar {
    width: 36px; height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--m-primary), var(--m-primary-light));
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 15px; font-weight: 600;
}

/* =================== 顶部主图标 banner（蓝渐变） =================== */
.m-hero-banner {
    background: linear-gradient(135deg, #1e88e5 0%, #0074D9 60%, #005ba0 100%);
    color: #fff;
    padding: 14px 16px 18px;
    position: relative;
}
.m-hero-banner::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0;
    height: 24px;
    background: linear-gradient(180deg, transparent, rgba(255,255,255,0.04));
    pointer-events: none;
}
.m-hero-title { font-size: 13px; opacity: 0.92; margin-bottom: 4px; letter-spacing: 0.4px; }
.m-hero-greeting {
    font-size: 22px; font-weight: 700; line-height: 1.25;
}
.m-hero-greeting .m-hero-name { font-size: 24px; }
.m-hero-top {
    display: flex; align-items: flex-start; justify-content: space-between;
    margin-bottom: 12px;
}
.m-hero-right {
    display: flex; flex-direction: column; align-items: flex-end; gap: 8px;
    flex-shrink: 0;
}
.m-hero-stats {
    display: flex; gap: 8px;
}
.m-hero-stat {
    display: flex; flex-direction: column; align-items: center;
    background: rgba(255,255,255,0.18);
    border-radius: 8px;
    padding: 4px 10px;
    min-width: 44px;
    color: #fff;
    transition: transform 0.15s;
}
.m-hero-stat:active { transform: scale(0.95); }
.m-hero-stat-dot {
    width: 6px; height: 6px; border-radius: 50%;
    background: #4ade80;
    box-shadow: 0 0 5px rgba(74,222,128,0.7);
    animation: m-pulse 2s infinite;
}
.m-hero-stat-num {
    font-size: 16px; font-weight: 700;
}
.m-hero-stat-label {
    font-size: 10px; opacity: 0.8;
}
.m-pc-switch {
    color: rgba(255,255,255,0.7);
    font-size: 18px;
    padding: 2px 4px;
}
.m-quick-grid {
    display: grid; grid-template-columns: repeat(4, 1fr);
    gap: 12px; margin-top: 10px;
}
.m-quick-item {
    display: flex; flex-direction: column; align-items: center;
    color: #fff; padding: 4px 2px;
    text-align: center;
}
.m-quick-icon {
    width: 48px; height: 48px;
    border-radius: 14px;
    background: rgba(255,255,255,0.96);
    color: var(--m-primary);
    display: flex; align-items: center; justify-content: center;
    font-size: 26px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.08);
}
.m-quick-item:active .m-quick-icon { transform: scale(0.94); }
.m-quick-icon.quick-blue   { color: var(--m-blue); }
.m-quick-icon.quick-cyan   { color: var(--m-cyan); }
.m-quick-icon.quick-green  { color: var(--m-green); }
.m-quick-icon.quick-orange { color: var(--m-orange); }
.m-quick-icon.quick-amber  { color: var(--m-amber); }
.m-quick-icon.quick-red    { color: var(--m-red); }
.m-quick-icon.quick-purple { color: var(--m-purple); }
.m-quick-icon.quick-indigo { color: var(--m-indigo); }
.m-quick-icon.quick-pink   { color: var(--m-pink); }
.m-quick-label {
    font-size: 12px; margin-top: 6px;
    opacity: 0.96; line-height: 1.2;
    color: #fff;
}

/* =================== 用户信息条 =================== */
.m-user-bar {
    background: #fff;
    margin: -10px 12px 0;
    border-radius: var(--m-r);
    padding: 12px 14px;
    display: flex; align-items: center; gap: 12px;
    box-shadow: 0 4px 14px rgba(15,23,42,0.06);
    position: relative; z-index: 2;
}
.m-user-bar .m-user-avatar {
    width: 44px; height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--m-primary), var(--m-primary-light));
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 18px; font-weight: 600; flex-shrink: 0;
}
.m-user-bar .m-user-info { flex: 1; min-width: 0; }
.m-user-bar .m-user-name {
    font-size: 16px; font-weight: 600; color: var(--m-text);
    display: flex; align-items: center; gap: 6px;
}
.m-user-bar .m-user-meta {
    font-size: 12px; color: var(--m-text-2); margin-top: 2px;
}
.m-user-bar .m-user-action {
    background: #fff; color: var(--m-primary);
    border: 1px solid var(--m-primary);
    border-radius: 999px;
    padding: 6px 14px; font-size: 13px; font-weight: 600;
    white-space: nowrap;
}
.m-user-bar .m-user-action:active { background: rgba(0,116,217,0.08); }

/* 在线人数指示器 */
.m-online-indicator {
    display: flex; flex-direction: column; align-items: center;
    padding: 4px 10px;
    background: linear-gradient(135deg, #ecfdf5, #d1fae5);
    border-radius: 10px;
    border: 1px solid #a7f3d0;
    min-width: 52px;
}
.m-online-dot {
    width: 8px; height: 8px; border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 6px rgba(34,197,94,0.6);
    animation: m-pulse 2s infinite;
}
@keyframes m-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.4; }
}
.m-online-num {
    font-size: 16px; font-weight: 700; color: #16a34a; line-height: 1.2;
}
.m-online-label {
    font-size: 10px; color: #16a34a; font-weight: 500;
}
/* 在线指示器可点击 */
a.m-online-indicator { transition: transform 0.15s; }
a.m-online-indicator:active { transform: scale(0.95); }

/* 今日访客指示器 */
.m-today-indicator {
    display: flex; flex-direction: column; align-items: center;
    padding: 4px 10px;
    background: linear-gradient(135deg, #eff6ff, #dbeafe);
    border-radius: 10px;
    border: 1px solid #93c5fd;
    min-width: 52px;
}
.m-today-num {
    font-size: 16px; font-weight: 700; color: #2563eb; line-height: 1.2;
}
.m-today-label {
    font-size: 10px; color: #2563eb; font-weight: 500;
}
a.m-today-indicator { transition: transform 0.15s; }
a.m-today-indicator:active { transform: scale(0.95); }

/* =================== 在线人员页面 =================== */
.m-online-page-header {
    display: flex; align-items: center; gap: 14px;
    padding: 20px 16px; margin-bottom: 12px;
    background: linear-gradient(135deg, #ecfdf5, #d1fae5);
}
.m-online-dot-big {
    width: 16px; height: 16px; border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 10px rgba(34,197,94,0.5);
    animation: m-pulse 2s infinite; flex-shrink: 0;
}
.m-online-page-header .m-online-info h3 {
    font-size: 18px; font-weight: 700; color: #065f46; margin: 0;
}
.m-online-page-header .m-online-info p {
    font-size: 13px; color: #059669; margin: 2px 0 0;
}

.m-online-user-item {
    display: flex; align-items: center; gap: 12px;
    padding: 12px 0; border-bottom: 1px solid var(--m-divider);
}
.m-online-user-item:last-child { border-bottom: none; }
.m-online-user-avatar {
    width: 42px; height: 42px; border-radius: 50%;
    background: linear-gradient(135deg, #22c55e, #16a34a);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 17px; font-weight: 600; flex-shrink: 0;
}
.m-online-user-info { flex: 1; min-width: 0; }
.m-online-user-name {
    font-size: 15px; font-weight: 600; color: var(--m-text);
    display: flex; align-items: center; gap: 6px;
}
.m-online-mini-dot {
    width: 6px; height: 6px; border-radius: 50%;
    background: #22c55e; flex-shrink: 0;
    box-shadow: 0 0 4px rgba(34,197,94,0.5);
}
.m-online-user-meta {
    font-size: 12px; color: var(--m-text-2); margin-top: 2px;
}
.m-online-user-time {
    font-size: 11px; color: var(--m-text-3); margin-top: 2px;
}

/* =================== 主体内容 =================== */
.m-main {
    padding: 14px 12px calc(var(--m-nav-h) + env(safe-area-inset-bottom, 0) + 24px);
    max-width: 100%;
}

/* =================== 卡片 =================== */
.m-card {
    background: var(--m-card);
    border-radius: var(--m-r);
    padding: 14px;
    margin-bottom: 12px;
    box-shadow: 0 2px 8px rgba(15,23,42,0.04);
}
.m-card-title {
    font-size: 15px; font-weight: 600;
    margin: 0 0 12px;
    display: flex; align-items: center; justify-content: space-between;
    color: var(--m-text);
}
.m-card-title .m-card-title-left {
    display: flex; align-items: center; gap: 6px;
}
.m-card-title i { color: var(--m-primary); font-size: 16px; }
.m-card-title .m-sub {
    font-size: 12px; font-weight: 400; color: var(--m-text-3);
}

/* =================== 功能网格（彩色图标 3 列，更舒展） =================== */
.m-func-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px 8px;
}
.m-func-item {
    display: flex; flex-direction: column; align-items: center;
    padding: 12px 6px;
    color: var(--m-text);
    text-align: center;
    border-radius: 12px;
}
.m-func-item:active { background: var(--m-bg-soft); }
.m-func-icon {
    width: 54px; height: 54px;
    border-radius: 14px;
    display: flex; align-items: center; justify-content: center;
    font-size: 26px;
    margin-bottom: 8px;
}
.m-func-icon.func-blue   { background: rgba(0,116,217,0.12);   color: var(--m-blue); }
.m-func-icon.func-cyan   { background: rgba(20,184,166,0.14);  color: var(--m-cyan); }
.m-func-icon.func-green  { background: rgba(34,197,94,0.14);   color: var(--m-green); }
.m-func-icon.func-orange { background: rgba(249,115,22,0.14);  color: var(--m-orange); }
.m-func-icon.func-amber  { background: rgba(245,158,11,0.16);  color: var(--m-amber); }
.m-func-icon.func-red    { background: rgba(239,68,68,0.12);   color: var(--m-red); }
.m-func-icon.func-purple { background: rgba(139,92,246,0.14);  color: var(--m-purple); }
.m-func-icon.func-indigo { background: rgba(99,102,241,0.14);  color: var(--m-indigo); }
.m-func-icon.func-brown  { background: rgba(180,83,9,0.12);    color: #b45309; }
.m-func-icon.func-pink   { background: rgba(236,72,153,0.14);  color: var(--m-pink); }
.m-func-label {
    font-size: 13px; line-height: 1.3; color: var(--m-text); font-weight: 500;
}

/* =================== 统计卡（保留兼容） =================== */
.m-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 12px;
}
.m-stat {
    background: var(--m-card);
    border-radius: var(--m-r);
    padding: 14px;
    box-shadow: 0 2px 8px rgba(15,23,42,0.04);
}
.m-stat .m-stat-ico { color: var(--m-primary); font-size: 18px; margin-bottom: 4px; }
.m-stat .m-stat-val { font-size: 28px; font-weight: 700; color: var(--m-text); line-height: 1.15; }
.m-stat .m-stat-label { font-size: 12px; color: var(--m-text-2); margin-top: 4px; }
.m-stat .m-stat-roles { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; justify-content: center; }
.m-stat .m-stat-roles .m-role-tag { font-size: 10px; padding: 2px 6px; border-radius: 4px; font-weight: 500; white-space: nowrap; }
.m-stat .m-stat-roles .m-role-tag.design { background: rgba(59,130,246,0.12); color: #2563eb; }
.m-stat .m-stat-roles .m-role-tag.review { background: rgba(14,165,233,0.12); color: #0284c7; }
.m-stat .m-stat-roles .m-role-tag.audit { background: rgba(107,114,128,0.12); color: #4b5563; }

/* =================== 列表项 =================== */
.m-list {
    background: var(--m-card);
    border-radius: var(--m-r);
    overflow: hidden;
    margin-bottom: 12px;
    box-shadow: 0 2px 8px rgba(15,23,42,0.04);
}
.m-list-item {
    display: flex; align-items: center;
    padding: 14px;
    border-bottom: 1px solid var(--m-divider);
    gap: 12px;
}
.m-list-item:last-child { border-bottom: none; }
.m-list-item .m-li-body { flex: 1; min-width: 0; }
.m-list-item .m-li-title { font-weight: 500; font-size: 14px; color: var(--m-text); }
.m-list-item .m-li-sub { font-size: 12px; color: var(--m-text-2); margin-top: 2px; }
.m-list-item .m-li-ico { color: var(--m-primary); font-size: 18px; flex-shrink: 0; }
.m-list-item .m-li-arrow { color: var(--m-text-3); font-size: 14px; flex-shrink: 0; }

/* =================== 徽章 =================== */
.m-badge {
    display: inline-flex; align-items: center; gap: 4px;
    font-size: 11px; font-weight: 500;
    padding: 2px 8px; border-radius: 999px;
}
.m-badge.primary { background: rgba(0,116,217,0.12); color: var(--m-primary); }
.m-badge.success { background: rgba(34,197,94,0.14); color: var(--m-green); }
.m-badge.warning { background: rgba(245,158,11,0.16); color: var(--m-amber); }
.m-badge.danger  { background: rgba(239,68,68,0.12); color: var(--m-red); }
.m-badge.gray    { background: var(--m-bg-soft); color: var(--m-text-2); }
.m-badge.info    { background: rgba(20,184,166,0.14); color: var(--m-cyan); }
.m-badge.purple  { background: rgba(139,92,246,0.14); color: var(--m-purple); }

/* =================== 公告 =================== */
.m-news-item {
    padding: 10px 0;
    border-bottom: 1px solid var(--m-divider);
    cursor: pointer;
}
.m-news-item:last-child { border-bottom: none; }
.m-news-item .m-news-title {
    font-weight: 600; font-size: 14px; line-height: 1.5;
    display: flex; align-items: center; gap: 6px;
}
.m-news-item.m-news-read .m-news-title { color: var(--m-text-2); font-weight: 500; }
.m-news-item.m-news-read .m-news-desc,
.m-news-item.m-news-read .m-news-meta { color: var(--m-text-3); }
.m-news-dot {
    width: 7px; height: 7px; border-radius: 50%; background: #dc3545;
    flex: 0 0 auto;
}
.m-news-read .m-news-dot { background: transparent; }
.m-news-item .m-news-desc {
    font-size: 12px; color: var(--m-text-2); margin: 4px 0 0; line-height: 1.55;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden;
}
.m-news-item .m-news-meta {
    font-size: 11px; color: var(--m-text-3); margin-top: 4px;
}

/* 通知全文弹层 */
.m-ann-modal {
    position: fixed; inset: 0; z-index: 2000;
    display: flex; align-items: flex-end; justify-content: center;
}
.m-ann-modal-mask { position: absolute; inset: 0; background: rgba(0,0,0,.5); }
.m-ann-modal-panel {
    position: relative; width: 100%; max-width: 480px;
    background: #fff; border-radius: 18px 18px 0 0;
    padding: 16px 18px calc(20px + env(safe-area-inset-bottom));
    max-height: 72vh; overflow-y: auto;
    animation: m-sheet-up .22s ease;
}
@keyframes m-sheet-up { from { transform: translateY(30px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.m-ann-modal-head { display: flex; align-items: flex-start; gap: 10px; }
.m-ann-modal-title { font-size: 15px; font-weight: 700; line-height: 1.5; flex: 1; }
.m-ann-modal-close { font-size: 16px; color: var(--m-text-3); cursor: pointer; padding: 2px 4px; }
.m-ann-modal-meta { font-size: 12px; color: var(--m-text-3); margin: 8px 0 6px; }
.m-ann-modal-study {
    font-size: 12px; color: #0c63e4; background: #e7f1ff;
    border-radius: 8px; padding: 8px 10px; margin: 6px 0;
    line-height: 1.6;
}
.m-ann-modal-content { font-size: 14px; line-height: 1.8; color: var(--m-text); white-space: pre-wrap; }
.m-ann-modal-btn {
    width: 100%; margin-top: 16px; padding: 10px;
    border: none; border-radius: 10px;
    background: var(--m-primary); color: #fff; font-size: 15px; cursor: pointer;
}

/* =================== 月份选择 =================== */
.m-monthbar {
    display: flex; align-items: center; justify-content: space-between;
    background: var(--m-card); border-radius: var(--m-r);
    padding: 12px 14px; margin-bottom: 12px;
    box-shadow: 0 2px 8px rgba(15,23,42,0.04);
}
.m-monthbar .m-month-label { font-weight: 600; font-size: 15px; }
.m-monthbar a {
    width: 36px; height: 36px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    background: var(--m-bg-soft); color: var(--m-primary); font-size: 16px;
}
.m-monthbar a:active { background: rgba(0,116,217,0.18); }

/* 密码到期提醒横幅 */
.m-expiry-warning {
    background: #fff7e6; border: 1px solid #ffd591; color: #ad6800;
    border-radius: var(--m-r); padding: 8px 12px; margin-bottom: 12px;
    font-size: 13px; line-height: 1.5;
}
.m-expiry-warning a { color: #d46b08; font-weight: 600; text-decoration: underline; }

/* 下拉刷新指示器 */
.m-pull-refresh {
    position: fixed; top: 0; left: 0; right: 0; z-index: 999;
    background: var(--m-bg, #f5f7fa); color: var(--m-text-2);
    text-align: center; font-size: 13px; padding: 10px 0 16px;
    transform: translateY(-100%); transition: transform 0.2s;
    pointer-events: none;
}
.m-pull-refresh.ready, .m-pull-refresh.refreshing { transform: translateY(0); }
.m-pull-refresh.refreshing { color: var(--m-primary); font-weight: 600; }

/* 我的任务 / 全部卷册 切换 */
.m-scope-switch {
    display: flex; align-items: center; justify-content: space-between;
    background: var(--m-bg-soft); border: 1px solid var(--m-border);
    border-radius: var(--m-r); padding: 8px 12px; margin-bottom: 12px;
    font-size: 13px; color: var(--m-text-2); gap: 8px;
}
.m-scope-btn {
    flex-shrink: 0; padding: 4px 12px; border-radius: 8px;
    background: var(--m-primary); color: #fff; font-size: 12px; font-weight: 600;
}
.m-scope-btn:active { opacity: 0.8; }

/* =================== 表单 =================== */
.m-select, .m-input {
    width: 100%;
    border: 1px solid var(--m-border);
    border-radius: 10px;
    padding: 11px 12px;
    font-size: 14px;
    background: #fff;
    color: var(--m-text);
}
.m-select:focus, .m-input:focus { outline: none; border-color: var(--m-primary); box-shadow: 0 0 0 3px rgba(0,116,217,0.12); }
.m-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    background: var(--m-primary); color: #fff;
    border: none; border-radius: 10px; padding: 12px 16px;
    font-size: 14px; font-weight: 500; width: 100%;
}
.m-btn:active { background: var(--m-primary-dark); }
.m-btn.m-btn-ghost { background: #fff; color: var(--m-primary); border: 1px solid var(--m-primary); }
.m-btn.m-btn-danger { background: var(--m-red); }

/* =================== 卷册卡 =================== */
.m-volgroup {
    background: var(--m-card); border-radius: var(--m-r); overflow: hidden;
    margin-bottom: 12px;
    box-shadow: 0 2px 8px rgba(15,23,42,0.04);
}
.m-vol {
    position: relative;
    background: #fff;
    border-bottom: 1px solid var(--m-divider);
    padding: 14px 14px 14px 18px;
}
.m-vol:last-child { border-bottom: none; }
.m-vol::before {
    content: ""; position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 4px;
    background: var(--m-primary);
}
.m-vol.is-added::before { background: var(--m-red); }
.m-vol.is-deleted::before { background: var(--m-text-3); }
/* 移动端不单独标记"调整到下个月"（灰色底色标记仅用于电脑版本月施工图计划页） */
.m-vol-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.m-vol-code {
    font-weight: 700; font-size: 14px; color: var(--m-primary);
    background: rgba(0,116,217,0.08); padding: 2px 8px; border-radius: 6px;
}
.m-vol-name { font-weight: 500; font-size: 14px; flex: 1; min-width: 0; line-height: 1.4; }
.m-vol-meta { font-size: 12px; color: var(--m-text-2); line-height: 1.7; }
.m-vol-meta b { color: var(--m-text); font-weight: 500; }
.m-vol-foot { display: flex; align-items: center; gap: 6px; margin-top: 8px; flex-wrap: wrap; }

/* =================== 折叠（资源中心） =================== */
.m-acc {
    background: var(--m-card); border-radius: var(--m-r); margin-bottom: 10px;
    box-shadow: 0 2px 8px rgba(15,23,42,0.04); overflow: hidden;
}
.m-acc-head {
    display: flex; align-items: center; gap: 10px;
    padding: 14px; cursor: pointer; font-weight: 500; font-size: 14px;
}
.m-acc-head i.cat-ico { color: var(--m-primary); font-size: 18px; }
.m-acc-head .m-acc-count {
    margin-left: auto; font-size: 11px; color: var(--m-text-3);
    background: var(--m-bg-soft); padding: 2px 9px; border-radius: 999px;
}
.m-acc-head .m-acc-chev { transition: transform .2s; color: var(--m-text-3); font-size: 13px; }
.m-acc.open .m-acc-chev { transform: rotate(90deg); }
.m-acc:not(.open) .m-acc-body { display: none !important; border-top: 1px solid var(--m-divider); }
.m-acc.open .m-acc-body { display: block; }
.m-topic { padding: 12px 14px 12px 38px; border-bottom: 1px solid var(--m-divider); }
.m-topic:last-child { border-bottom: none; }
.m-topic .m-topic-title { font-weight: 500; font-size: 13px; display: flex; align-items: center; gap: 6px; cursor: pointer; }
.m-topic .m-topic-chev { margin-left: auto; transition: transform .2s; color: var(--m-text-3); font-size: 13px; }
.m-topic.open .m-topic-chev { transform: rotate(90deg); }
.m-topic:not(.open) .m-topic-body { display: none !important; }
.m-topic.open .m-topic-body { display: block; }
.m-topic .m-topic-desc { font-size: 12px; color: var(--m-text-2); margin: 2px 0 0; }
.m-link {
    display: flex; align-items: center; gap: 8px;
    padding: 12px 14px 12px 50px; font-size: 13px;
    border-bottom: 1px dashed var(--m-divider); color: var(--m-primary);
}
.m-link:last-child { border-bottom: none; }
.m-link i { font-size: 14px; }

/* =================== 空状态 =================== */
.m-empty { text-align: center; padding: 36px 16px; color: var(--m-text-3); font-size: 13px; }
.m-empty i { font-size: 36px; display: block; margin-bottom: 8px; color: var(--m-border); }

/* =================== 加载更多（公告） =================== */
.m-more-wrap { text-align: center; padding: 12px 0 14px; }
.m-more-btn {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 7px 18px; border-radius: 20px;
    border: 1px solid var(--m-border); background: #f8fafc;
    color: var(--m-text-2); font-size: 13px; cursor: pointer;
}
.m-more-btn:active { background: #eef2f7; }

/* =================== 底部 Tab 导航（5项+中央凸起按钮） =================== */
.m-tabbar {
    position: fixed; left: 0; right: 0; bottom: 0;
    height: calc(var(--m-nav-h) + env(safe-area-inset-bottom, 0));
    background: #fff;
    border-top: 1px solid var(--m-border);
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    z-index: 60;
    box-shadow: 0 -2px 12px rgba(15,23,42,0.04);
    padding-bottom: env(safe-area-inset-bottom, 0);
}
.m-tab {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    color: var(--m-text-3); font-size: 11px; gap: 2px;
    position: relative;
}
.m-tab i { font-size: 20px; }
.m-tab.active { color: var(--m-primary); }
.m-tab.active i { transform: scale(1.05); }
.m-tab-fab {
    position: relative;
    margin-top: -22px;
    display: flex; flex-direction: column; align-items: center;
    color: var(--m-text-3); font-size: 11px;
}
.m-tab-fab .m-fab {
    width: 50px; height: 50px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--m-primary), var(--m-primary-light));
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 24px;
    box-shadow: 0 6px 16px rgba(0,116,217,0.4);
    margin-bottom: 2px;
}
.m-tab-fab:active .m-fab { transform: scale(0.95); }
.m-tab-fab.active .m-fab {
    background: linear-gradient(135deg, var(--m-primary-dark), var(--m-primary));
}

/* =================== 提示条 =================== */
.m-tip {
    font-size: 12px; color: var(--m-text-2);
    background: var(--m-bg-soft); border: 1px solid var(--m-border);
    border-radius: 10px; padding: 10px 12px; margin-bottom: 12px; line-height: 1.6;
}
.m-tip i { color: var(--m-primary); margin-right: 2px; }

/* =================== 登录页 =================== */
.m-login { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column;
    background: linear-gradient(160deg, var(--m-primary), var(--m-primary-dark)); }
.m-login-box { margin: auto 18px; background: #fff; border-radius: 20px; padding: 24px 18px; box-shadow: 0 20px 50px rgba(0,0,0,0.2); }
.m-login-brand { text-align: center; color: #fff; margin: 44px 0 24px; }
.m-login-brand i { font-size: 44px; }
.m-login-brand h2 { font-size: 21px; margin: 12px 0 4px; font-weight: 700; letter-spacing: 1px; }
.m-login-brand p { margin: 0; opacity: 0.9; font-size: 13px; }
.m-login .m-form-label { font-size: 13px; color: var(--m-text-2); font-weight: 500; margin-bottom: 6px; display: block; }
.m-login .m-foot-note { text-align: center; color: rgba(255,255,255,0.85); font-size: 12px; margin: 14px 0 26px; }

/* =================== 进度条 =================== */
.m-progress { height: 6px; background: var(--m-bg-soft); border-radius: 999px; overflow: hidden; margin-top: 6px; }
.m-progress > span { display: block; height: 100%; background: linear-gradient(90deg, var(--m-primary), var(--m-primary-light)); }

/* =================== toast =================== */
.m-toast {
    position: fixed; left: 50%; bottom: calc(var(--m-nav-h) + env(safe-area-inset-bottom, 0) + 14px);
    transform: translateX(-50%);
    background: rgba(15,23,42,0.92); color: #fff;
    padding: 11px 18px; border-radius: 10px; font-size: 13px;
    z-index: 999; opacity: 0; transition: opacity .2s; pointer-events: none;
    max-width: 88%; text-align: center;
}
.m-toast.show { opacity: 1; }

/* =================== 小屏适配 =================== */
@media (max-width: 360px) {
    .m-hero-greeting { font-size: 20px; }
    .m-quick-icon { width: 42px; height: 42px; font-size: 22px; }
    .m-func-icon { width: 48px; height: 48px; font-size: 22px; }
    .m-func-label { font-size: 12px; }
    .m-func-grid { grid-template-columns: repeat(3, 1fr); gap: 8px 4px; }
}

/* =================== 人员登录使用情况卡片 =================== */
.m-usage-card {
    padding: 12px 0;
    border-bottom: 1px solid var(--m-divider);
}
.m-usage-card:last-child { border-bottom: none; }

.m-usage-inactive { opacity: 0.6; }

.m-usage-head {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 8px;
}
.m-usage-name {
    font-size: 15px; font-weight: 600; color: var(--m-text);
    display: flex; align-items: center; gap: 6px;
}

/* 在线状态指示器 */
.m-online-bar {
    background: var(--m-card);
    border-radius: var(--m-r);
    padding: 12px 14px;
    margin-bottom: 12px;
    display: flex; align-items: center; gap: 10px;
    box-shadow: 0 2px 8px rgba(15,23,42,0.04);
}
.m-online-dot {
    width: 12px; height: 12px;
    border-radius: 50%;
    background: var(--m-green);
    animation: m-online-pulse 2s infinite;
    flex-shrink: 0;
}
.m-online-text { flex: 1; font-size: 14px; color: var(--m-text); }
.m-online-text strong { color: var(--m-green); font-size: 20px; font-weight: 700; }

.m-online-dot-card {
    display: inline-block;
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--m-green);
    box-shadow: 0 0 8px rgba(34,197,94,0.5);
    flex-shrink: 0;
}

@keyframes m-online-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0.5); }
    50% { box-shadow: 0 0 0 6px rgba(34,197,94,0); }
}
.m-usage-meta {
    font-size: 11px; color: var(--m-text-3);
}

.m-usage-row {
    display: flex; gap: 6px;
    margin-bottom: 6px;
}
.m-usage-cell {
    flex: 1; min-width: 0;
    background: var(--m-bg-soft);
    border-radius: 8px;
    padding: 8px 10px;
}
.m-usage-label {
    font-size: 11px; color: var(--m-text-3); margin-bottom: 3px;
}
.m-usage-val {
    font-size: 13px; font-weight: 500; color: var(--m-text);
    line-height: 1.5;
}
.m-usage-val.m-usage-positive { color: var(--m-green); }
.m-usage-val.m-usage-zero { color: var(--m-text-3); }
.m-usage-val.m-usage-small { font-size: 12px; color: var(--m-text-2); }

.m-usage-time {
    font-size: 11px; color: var(--m-text-3); margin-top: 2px;
}

/* 登录状态徽章颜色 */
.m-badge.badge-green  { background: rgba(34,197,94,0.14); color: var(--m-green); }
.m-badge.badge-amber  { background: rgba(245,158,11,0.16); color: var(--m-amber); }
.m-badge.badge-red    { background: rgba(239,68,68,0.12); color: var(--m-red); }
.m-badge.badge-gray   { background: var(--m-bg-soft); color: var(--m-text-2); }

/* =================== 手机版专属隐藏（兜底） =================== */
/* PC 仪表盘 4 张主任统计卡（在职人员/活跃项目/科室工天×2）只供 PC 显示，
   手机版工作台一律不展示。即使旧版 HTML 因 OPcache/浏览器缓存返回也强制隐藏。 */
.m-active-staff-card,
.m-active-project-card,
.m-department-workday-card,
.m-department-year-workday-card,
.active-staff-card,
.active-project-card,
.department-workday-card,
.department-year-workday-card {
    display: none !important;
}

/* =================== 手机版项目查询 =================== */
.m-pj-search {
    padding: 0 0 12px 0;
}
.m-pj-form {
    display: flex; flex-direction: column; gap: 10px;
}
.m-pj-input-wrap {
    position: relative; display: flex; align-items: center;
}
.m-pj-search-ico {
    position: absolute; left: 12px; color: var(--m-text-3); font-size: 16px; z-index: 1;
}
.m-pj-input {
    flex: 1; width: 100%;
    padding: 10px 36px 10px 36px;
    border: 1px solid var(--m-divider); border-radius: 24px;
    font-size: 14px; background: var(--m-card); outline: none;
    transition: border-color 0.2s;
}
.m-pj-input:focus { border-color: var(--m-primary); }
.m-pj-clear {
    position: absolute; right: 12px; color: var(--m-text-3); font-size: 16px;
}
.m-pj-filters {
    display: flex; gap: 8px;
}
.m-pj-select {
    flex: 1;
    padding: 8px 10px; border: 1px solid var(--m-divider); border-radius: 8px;
    font-size: 13px; background: var(--m-card); color: var(--m-text); outline: none;
}
.m-pj-summary {
    font-size: 13px; color: var(--m-text-2); margin-bottom: 10px;
    text-align: center;
}
.m-pj-card {
    display: block; background: var(--m-card); border-radius: var(--m-r);
    padding: 14px; margin-bottom: 10px;
    text-decoration: none; color: inherit;
    box-shadow: 0 2px 8px rgba(15,23,42,0.04);
    transition: transform 0.15s, box-shadow 0.15s;
}
.m-pj-card:active { transform: scale(0.98); box-shadow: 0 1px 4px rgba(15,23,42,0.06); }
.m-pj-inactive { opacity: 0.65; }
.m-pj-card-top {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 6px;
}
.m-pj-code {
    font-size: 13px; font-weight: 700; color: var(--m-primary);
    font-family: monospace;
}
.m-pj-status {
    font-size: 11px; padding: 2px 8px; border-radius: 10px; font-weight: 500;
}
.m-pj-status-active { background: #dcfce7; color: #166534; }
.m-pj-status-inactive { background: #f1f5f9; color: #64748b; }
.m-pj-name {
    font-size: 15px; font-weight: 600; color: var(--m-text);
    margin-bottom: 6px; line-height: 1.4;
}
.m-pj-meta {
    display: flex; flex-wrap: wrap; gap: 6px;
}
.m-pj-tag {
    font-size: 12px; color: var(--m-text-2);
    background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 6px;
    padding: 2px 8px; white-space: nowrap;
}
.m-pj-tag i { font-size: 11px; }
.m-pj-footer {
    display: flex; gap: 14px; margin-top: 10px;
    padding-top: 8px; border-top: 1px solid var(--m-divider);
    font-size: 12px; color: var(--m-text-3);
}
.m-pj-footer i { font-size: 12px; margin-right: 2px; }
.m-pj-pagination {
    display: flex; justify-content: center; align-items: center;
    gap: 6px; margin-top: 14px; padding: 10px 0;
    flex-wrap: wrap;
}
.m-pj-page-btn {
    padding: 6px 12px; border-radius: 8px; font-size: 13px;
    border: 1px solid var(--m-divider); color: var(--m-text); text-decoration: none;
    display: flex; align-items: center; gap: 4px;
    background: var(--m-card);
}
.m-pj-page-btn:active { background: var(--m-bg); }
.m-pj-page-disabled { opacity: 0.4; pointer-events: none; }
.m-pj-page-num {
    width: 32px; height: 32px; border-radius: 8px;
    display: flex; align-items: center; justify-content: center;
    font-size: 13px; color: var(--m-text); text-decoration: none;
    border: 1px solid var(--m-divider); background: var(--m-card);
}
.m-pj-page-num:active { background: var(--m-bg); }
.m-pj-page-current {
    background: var(--m-primary); color: #fff; border-color: var(--m-primary);
    font-weight: 600;
}
.m-pj-page-dots { color: var(--m-text-3); font-size: 13px; padding: 0 2px; }
.m-empty {
    text-align: center; padding: 48px 20px;
}

/* =================== 工天查询页面 =================== */
.m-view-tabs {
    display: flex; gap: 4px; border-bottom: 1px solid var(--m-divider); padding-bottom: 8px;
}
.m-view-tab {
    flex: 1; text-align: center; padding: 8px 4px; font-size: 13px; color: var(--m-text-2);
    text-decoration: none; border-radius: 6px; background: var(--m-bg); transition: all 0.2s;
}
.m-view-tab.active {
    background: var(--m-primary); color: #fff; font-weight: 600;
}
.m-view-tab:active { transform: scale(0.98); }

.m-yearbar {
    display: flex; gap: 8px; justify-content: center; padding: 4px 0;
}
.m-year-pill {
    padding: 6px 16px; border-radius: 20px; font-size: 13px; color: var(--m-text-2);
    text-decoration: none; background: var(--m-bg); border: 1px solid var(--m-divider);
    transition: all 0.2s;
}
.m-year-pill.active {
    background: var(--m-primary); color: #fff; border-color: var(--m-primary); font-weight: 600;
}
.m-year-pill:active { transform: scale(0.95); }
/* =================== P1-1 消息中心 + FAB 红点 + 回到顶部 =================== */
.m-fab { position: relative; }
.m-fab-badge {
    position: absolute; top: -4px; right: -6px;
    min-width: 18px; height: 18px; padding: 0 5px;
    border-radius: 10px; background: #ff3b30; color: #fff;
    font-size: 11px; font-weight: 700; line-height: 18px;
    text-align: center; box-shadow: 0 2px 6px rgba(255,59,48,0.5);
    box-sizing: border-box;
}
/* 浮动消息按钮（不再占用底部 Tab，保留工天等一级入口） */
.m-fab-float {
    position: fixed; right: 14px;
    bottom: calc(var(--m-nav-h) + env(safe-area-inset-bottom, 0) + 16px);
    z-index: 56; text-decoration: none; -webkit-tap-highlight-color: transparent;
}
.m-fab-float .m-fab {
    position: relative; width: 46px; height: 46px; border-radius: 50%;
    background: linear-gradient(135deg, #0074D9, #0091d5); color: #fff;
    display: flex; align-items: center; justify-content: center; font-size: 20px;
    box-shadow: 0 6px 18px rgba(0,116,217,0.42);
}
.m-fab-float:active .m-fab { transform: scale(0.94); }
.m-fab-float.active .m-fab { box-shadow: 0 0 0 3px rgba(0,116,217,0.22), 0 6px 18px rgba(0,116,217,0.42); }
.m-top-btn {
    position: fixed; right: 14px; bottom: calc(var(--m-nav-h) + env(safe-area-inset-bottom, 0) + 72px);
    width: 42px; height: 42px; border-radius: 50%; border: none;
    background: rgba(255,255,255,0.96); color: var(--m-primary);
    font-size: 20px; box-shadow: 0 4px 14px rgba(15,23,42,0.18);
    display: flex; align-items: center; justify-content: center;
    opacity: 0; visibility: hidden; transform: translateY(10px);
    transition: all 0.25s; z-index: 55; cursor: pointer;
}
.m-top-btn.show { opacity: 1; visibility: visible; transform: translateY(0); }
.m-top-btn:active { transform: scale(0.92); }

/* 分段 Tab */
.mseg-tab {
    flex: 1; text-align: center; padding: 12px 0; font-size: 14px;
    color: var(--m-text-2); text-decoration: none; font-weight: 500;
    border-bottom: 3px solid transparent;
}
.mseg-tab.on { color: var(--m-primary); font-weight: 700; border-bottom-color: var(--m-primary); }
.mseg-count {
    display: inline-block; min-width: 18px; height: 18px; padding: 0 5px;
    border-radius: 9px; background: #ff3b30; color: #fff;
    font-size: 11px; line-height: 18px; margin-left: 4px;
    vertical-align: 1px; font-weight: 700; text-align: center;
}

/* 消息/公告折叠列表 */
.m-msg-item { padding: 12px 14px; }
.m-msg-head { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.m-msg-dot { width: 8px; height: 8px; border-radius: 50%; background: #ff3b30; flex-shrink: 0; }
.m-msg-title { flex: 1; font-size: 15px; font-weight: 600; color: var(--m-text-1);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.m-msg-item.unread .m-msg-title { color: var(--m-primary); }
.m-msg-arrow { color: var(--m-text-3); font-size: 13px; transition: transform 0.2s; flex-shrink: 0; }
.m-msg-item.open .m-msg-arrow { transform: rotate(180deg); }
.m-msg-meta { font-size: 12px; color: var(--m-text-3); margin-top: 3px; padding-left: 16px; }
.m-msg-body {
    display: none; margin-top: 10px; padding: 10px 12px;
    background: var(--m-bg-soft); border-radius: 10px;
    font-size: 14px; line-height: 1.7; color: var(--m-text-2);
    word-break: break-word;
}
.m-msg-item.open .m-msg-body { display: block; }

/* =================== 查询中心：项目 / 施工图 =================== */
.m-query-hero {
    display:flex; align-items:center; gap:12px;
    margin:-2px 0 12px; padding:14px;
    border-radius:var(--m-r); color:#fff;
    background:linear-gradient(135deg,#0074d9,#0891b2);
    box-shadow:0 8px 20px rgba(0,116,217,.18);
}
.m-volume-query-hero { background:linear-gradient(135deg,#0f766e,#0074d9); }
.m-query-hero-icon {
    width:42px; height:42px; flex:0 0 42px; border-radius:13px;
    display:flex; align-items:center; justify-content:center;
    background:rgba(255,255,255,.18); font-size:22px;
}
.m-query-hero strong { display:block; font-size:17px; line-height:1.35; }
.m-query-hero span { display:block; margin-top:2px; font-size:12px; opacity:.88; }
.m-query-panel { background:var(--m-card); border-radius:var(--m-r); padding:12px; margin-bottom:12px; box-shadow:0 2px 8px rgba(15,23,42,.04); }
.m-search-line { display:flex; align-items:center; min-height:44px; border:1px solid var(--m-border); border-radius:12px; padding:0 11px; background:#fff; }
.m-search-line:focus-within { border-color:var(--m-primary); box-shadow:0 0 0 3px rgba(0,116,217,.10); }
.m-search-line > i { flex:0 0 auto; margin-right:8px; color:var(--m-text-3); font-size:16px; }
.m-search-line input { width:100%; min-width:0; border:0; outline:0; padding:10px 0; font:inherit; color:var(--m-text); background:transparent; }
.m-search-line a { flex:0 0 auto; color:var(--m-text-3); padding:3px; font-size:16px; }
.m-filter-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px; }
.m-filter-grid label { min-width:0; }
.m-filter-grid label > span { display:block; margin:0 0 4px 2px; font-size:11px; color:var(--m-text-3); }
.m-filter-grid select { width:100%; height:38px; border:1px solid var(--m-border); border-radius:9px; padding:0 8px; color:var(--m-text); background:#fff; font-size:13px; outline:0; }
.m-filter-grid select:focus { border-color:var(--m-primary); }
.m-filter-actions { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:10px; }
.m-filter-chips { flex:1; min-width:0; display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; }
.m-filter-chips::-webkit-scrollbar { display:none; }
.m-filter-chip { flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; min-height:31px; padding:0 10px; border:1px solid var(--m-border); border-radius:99px; color:var(--m-text-2); font-size:12px; background:#fff; }
.m-filter-chip input { position:absolute; opacity:0; pointer-events:none; }
.m-filter-chip.on { border-color:rgba(0,116,217,.25); background:rgba(0,116,217,.1); color:var(--m-primary); font-weight:700; }
.m-mini-primary { flex:0 0 auto; height:33px; border:0; border-radius:9px; padding:0 11px; color:#fff; background:var(--m-primary); font-size:12px; font-weight:600; }
.m-mini-primary:active { background:var(--m-primary-dark); }
.m-reset-filter { display:inline-flex; align-items:center; gap:4px; margin:9px 2px 0; color:var(--m-text-2); font-size:12px; }
.m-result-bar { display:flex; justify-content:space-between; align-items:center; gap:8px; margin:0 3px 10px; font-size:12px; color:var(--m-text-2); }
.m-result-bar b { color:var(--m-primary); font-size:14px; }
.m-result-bar span:last-child { color:var(--m-text-3); white-space:nowrap; }
.m-project-list { display:flex; flex-direction:column; gap:10px; }
.m-project-card { display:block; padding:14px; border-radius:var(--m-r); background:var(--m-card); color:var(--m-text); box-shadow:0 2px 8px rgba(15,23,42,.04); }
.m-project-card:active { transform:scale(.985); background:#fbfdff; }
.m-project-card.is-finished { opacity:.72; }
.m-project-card-head { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.m-project-code { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--m-primary); font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:12px; font-weight:700; }
.m-project-name { margin-top:6px; font-size:16px; font-weight:700; line-height:1.45; word-break:break-word; }
.m-project-tags { display:flex; flex-wrap:wrap; gap:5px; margin-top:8px; }
.m-project-tags span { display:inline-flex; align-items:center; gap:3px; max-width:100%; padding:3px 7px; border-radius:6px; background:#f8fafc; border:1px solid #e7edf5; color:var(--m-text-2); font-size:11px; }
.m-project-people { display:flex; flex-wrap:wrap; gap:10px; margin-top:9px; color:var(--m-text-2); font-size:12px; }
.m-project-people span { white-space:nowrap; }
.m-project-people i { margin-right:3px; color:var(--m-text-3); }
.m-project-stats { display:flex; flex-wrap:wrap; gap:7px 11px; margin-top:10px; padding-top:9px; border-top:1px solid var(--m-divider); color:var(--m-text-3); font-size:11px; }
.m-project-stats i { margin-right:3px; }
.m-project-volume { color:#0f766e; }
.m-project-open { display:flex; align-items:center; justify-content:flex-end; gap:3px; margin-top:8px; color:var(--m-primary); font-size:12px; font-weight:600; }
.m-query-empty strong { display:block; margin-top:8px; color:var(--m-text); font-size:14px; }
.m-query-empty p { margin:3px 0 0; }
.m-mobile-pagination { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:14px 0 2px; }
.m-mobile-pagination a,.m-mobile-pagination > span { min-width:92px; min-height:36px; display:inline-flex; align-items:center; justify-content:center; gap:4px; padding:0 10px; border:1px solid var(--m-border); border-radius:9px; background:#fff; color:var(--m-text); font-size:12px; }
.m-mobile-pagination > span:not(.disabled) { min-width:auto; border:0; background:transparent; color:var(--m-text-2); }
.m-mobile-pagination .disabled { color:var(--m-text-3); background:var(--m-bg-soft); }
.m-detail-back { display:inline-flex; align-items:center; gap:2px; margin:0 2px 10px; font-size:13px; color:var(--m-text-2); }
.m-detail-hero { padding:16px; border-radius:var(--m-r-lg); color:#fff; background:linear-gradient(135deg,#0074d9,#0f766e); box-shadow:0 8px 20px rgba(0,116,217,.18); }
.m-detail-hero.is-finished { background:linear-gradient(135deg,#64748b,#475569); }
.m-detail-code { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:12px; opacity:.9; }
.m-detail-name { margin-top:5px; font-size:19px; font-weight:700; line-height:1.42; word-break:break-word; }
.m-detail-badges { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.m-detail-badges .m-badge { background:rgba(255,255,255,.18); color:#fff; }
.m-detail-kpis { display:grid; grid-template-columns:repeat(3,1fr); margin:10px 0 12px; padding:10px 4px; border-radius:var(--m-r); background:var(--m-card); box-shadow:0 2px 8px rgba(15,23,42,.04); }
.m-detail-kpis > div { min-width:0; text-align:center; border-right:1px solid var(--m-divider); }
.m-detail-kpis > div:last-child { border:0; }
.m-detail-kpis strong { display:block; overflow:hidden; text-overflow:ellipsis; color:var(--m-primary); font-size:17px; }
.m-detail-kpis span { display:block; margin-top:2px; color:var(--m-text-3); font-size:11px; }
.m-detail-section { margin-bottom:12px; padding:14px; border-radius:var(--m-r); background:var(--m-card); box-shadow:0 2px 8px rgba(15,23,42,.04); }
.m-detail-section h2 { display:flex; align-items:center; gap:6px; margin:0 0 12px; color:var(--m-text); font-size:15px; }
.m-detail-section h2 i { color:var(--m-primary); font-size:16px; }
.m-detail-section-title { display:flex; align-items:center; justify-content:space-between; gap:6px; }
.m-detail-section-title a { margin-bottom:12px; font-size:12px; font-weight:600; }
.m-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:0; border-top:1px solid var(--m-divider); border-left:1px solid var(--m-divider); }
.m-detail-grid > div { min-width:0; padding:9px; border-right:1px solid var(--m-divider); border-bottom:1px solid var(--m-divider); }
.m-detail-grid span,.m-detail-people span { display:block; color:var(--m-text-3); font-size:11px; }
.m-detail-grid b,.m-detail-people b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-top:2px; color:var(--m-text); font-size:13px; font-weight:600; }
.m-detail-people { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.m-detail-people > div { min-width:0; padding:8px 9px; border-radius:9px; background:var(--m-bg-soft); }
.m-detail-none { padding:14px 6px; text-align:center; color:var(--m-text-3); font-size:12px; }
.m-detail-volume-list { border-top:1px solid var(--m-divider); }
.m-detail-volume { padding:10px 0; border-bottom:1px solid var(--m-divider); }
.m-detail-volume:last-child { border:0; }
.m-detail-volume > div:first-child { display:flex; gap:7px; font-size:13px; line-height:1.45; }
.m-detail-volume > div:first-child b { flex:0 0 auto; color:var(--m-primary); font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:11px; }
.m-detail-volume > div:first-child span { font-weight:600; }
.m-detail-volume-meta { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:6px; color:var(--m-text-3); font-size:11px; }
.m-detail-notes { color:var(--m-text-2); font-size:13px; line-height:1.75; word-break:break-word; }
.m-detail-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:0 0 4px; }
.m-detail-actions .m-btn { width:100%; padding:10px 7px; font-size:12px; }
.m-plan-month-nav { display:flex; align-items:center; justify-content:space-between; gap:5px; margin-bottom:10px; padding:8px; border-radius:var(--m-r); background:var(--m-card); box-shadow:0 2px 8px rgba(15,23,42,.04); }
.m-plan-month-nav > a { min-height:35px; display:flex; align-items:center; gap:3px; padding:0 7px; border-radius:8px; color:var(--m-primary); font-size:12px; }
.m-plan-month-nav label { min-width:0; display:flex; align-items:center; gap:5px; color:var(--m-text); font-size:13px; font-weight:700; }
.m-plan-month-nav input { width:100px; padding:0; border:0; background:transparent; color:var(--m-text); font:inherit; outline:0; }
.m-plan-groups { display:flex; flex-direction:column; gap:10px; }
.m-plan-project-group { overflow:hidden; border-radius:var(--m-r); background:var(--m-card); box-shadow:0 2px 8px rgba(15,23,42,.04); }
.m-plan-project-title { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:11px 13px; border-bottom:1px solid var(--m-divider); background:#f8fbff; color:var(--m-text); font-size:13px; }
.m-plan-project-title span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.m-plan-project-title b { margin-right:7px; color:var(--m-primary); font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:11px; }
.m-plan-project-title i { flex:0 0 auto; color:var(--m-text-3); }
.m-plan-volume { display:flex; gap:10px; padding:12px 13px; border-bottom:1px solid var(--m-divider); }
.m-plan-volume:last-child { border:0; }
.m-plan-volume.is-changed { background:linear-gradient(90deg,rgba(245,158,11,.09),#fff 30%); }
.m-plan-volume-main { flex:1; min-width:0; }
.m-plan-volume-title { display:flex; gap:7px; min-width:0; color:var(--m-text); font-size:13px; line-height:1.45; }
.m-plan-volume-title b { flex:0 0 auto; color:var(--m-primary); font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:11px; }
.m-plan-volume-title span { min-width:0; font-weight:600; word-break:break-word; }
.m-plan-volume-badges { display:flex; flex-wrap:wrap; gap:5px; margin-top:6px; }
.m-plan-volume-people { display:flex; flex-wrap:wrap; gap:5px 10px; margin-top:6px; color:var(--m-text-3); font-size:11px; }
.m-plan-volume-note { display:-webkit-box; overflow:hidden; -webkit-line-clamp:2; -webkit-box-orient:vertical; margin-top:5px; color:var(--m-text-2); font-size:11px; line-height:1.5; word-break:break-word; }
.m-plan-volume-note i { margin-right:3px; color:var(--m-text-3); }
.m-plan-volume-workdays { flex:0 0 42px; align-self:center; text-align:right; }
.m-plan-volume-workdays strong { display:block; color:var(--m-primary); font-size:15px; }
.m-plan-volume-workdays span { display:block; color:var(--m-text-3); font-size:10px; }
@media (max-width:360px) {
    .m-filter-chip { padding:0 8px; }
    .m-detail-kpis strong { font-size:15px; }
    .m-plan-month-nav > a { padding:0 4px; }
}