:root {
    --navy: #102838;
    --navy-2: #17394d;
    --blue: #4169e1;
    --blue-soft: #edf2ff;
    --green: #1f9d72;
    --orange: #e39a35;
    --red: #d95a62;
    --ink: #17242f;
    --muted: #74818c;
    --line: #e7ebee;
    --surface: #ffffff;
    --canvas: #f4f6f7;
    --shadow: 0 12px 32px rgba(20, 43, 58, .07);
    --radius: 16px;
    --sidebar: 246px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--canvas); font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", Arial, sans-serif; font-size: 14px; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, select { cursor: pointer; }
svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
h1, h2, h3, p { margin-top: 0; }

.app-shell { min-height: 100vh; }
.sidebar { position: fixed; inset: 0 auto 0 0; width: var(--sidebar); display: flex; flex-direction: column; padding: 24px 18px 18px; color: #d8e3e9; background: var(--navy); z-index: 30; overflow: hidden; }
.sidebar::before { content: ""; position: absolute; width: 260px; height: 260px; left: -100px; bottom: 55px; border-radius: 50%; background: rgba(63, 137, 166, .08); }
.brand { display: flex; align-items: center; gap: 11px; padding: 0 8px 25px; position: relative; }
.brand-mark { width: 38px; height: 38px; display: inline-grid; place-items: center; color: #fff; background: linear-gradient(145deg, #4d7bf1, #3557c6); border-radius: 12px; box-shadow: 0 7px 16px rgba(55, 93, 204, .32); flex: none; }
.brand-mark svg { width: 22px; height: 22px; }
.brand strong { display: block; color: #fff; font-size: 16px; letter-spacing: .5px; }
.brand small { display: block; color: #7590a1; font-size: 9px; letter-spacing: 1.8px; margin-top: 4px; }
.nav-label { display: block; padding: 9px 12px; color: #678294; font-size: 10px; letter-spacing: 1.5px; }
.main-nav { position: relative; }
.main-nav a { height: 47px; display: flex; align-items: center; gap: 13px; margin: 3px 0; padding: 0 13px; border-radius: 11px; color: #9fb1bd; transition: .2s; }
.main-nav a svg { width: 19px; height: 19px; }
.main-nav a:hover { color: #fff; background: rgba(255,255,255,.055); }
.main-nav a.active { color: #fff; background: linear-gradient(90deg, rgba(76,120,234,.28), rgba(76,120,234,.12)); box-shadow: inset 3px 0 #6088f2; }
.main-nav a em { margin-left: auto; min-width: 21px; height: 21px; display: grid; place-items: center; padding: 0 6px; color: #dfe8ff; background: rgba(91,132,238,.35); border-radius: 10px; font-size: 11px; font-style: normal; }
.sidebar-help { margin: auto 4px 18px; padding: 17px; position: relative; background: rgba(255,255,255,.055); border: 1px solid rgba(255,255,255,.07); border-radius: 13px; }
.sidebar-help .help-icon { width: 30px; height: 30px; display: grid; place-items: center; color: #a9c1ff; background: rgba(75,112,226,.22); border-radius: 9px; margin-bottom: 11px; }
.sidebar-help .help-icon svg { width: 16px; }
.sidebar-help strong { color: #e7eef2; font-size: 13px; }
.sidebar-help p { margin: 5px 0 0; color: #78909e; font-size: 11px; line-height: 1.6; }
.sidebar-user { display: flex; align-items: center; gap: 10px; padding: 14px 7px 0; position: relative; border-top: 1px solid rgba(255,255,255,.08); }
.sidebar-user > span:nth-child(2) { min-width: 0; flex: 1; }
.sidebar-user-info { min-width: 0; flex: 1; }
.sidebar-user strong, .sidebar-user small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sidebar-user strong { color: #f1f5f7; font-size: 12px; }
.sidebar-user small { margin-top: 3px; color: #79909e; font-size: 10px; }
.avatar { width: 36px; height: 36px; display: inline-grid; place-items: center; flex: none; color: #fff; background: linear-gradient(145deg, #6786d8, #4162bb); border-radius: 50%; font-weight: 700; }
.avatar.soft { color: #4162ac; background: #eaf0ff; }
.avatar.muted { filter: grayscale(1); opacity: .45; }
.sidebar-user .icon-btn { color: #78909e; }
.main-content { margin-left: var(--sidebar); min-height: 100vh; }
.topbar { height: 72px; display: flex; align-items: center; justify-content: space-between; padding: 0 34px; position: sticky; top: 0; background: rgba(244,246,247,.9); border-bottom: 1px solid rgba(222,227,231,.8); backdrop-filter: blur(14px); z-index: 20; }
.top-search { width: min(440px, 45vw); height: 40px; display: flex; align-items: center; gap: 9px; position: relative; padding: 0 13px; background: #fff; border: 1px solid #e5e9ed; border-radius: 11px; }
.top-search svg { width: 17px; color: #8c98a1; }
.top-search input { min-width: 0; flex: 1; border: 0; outline: 0; color: var(--ink); background: transparent; }
.top-search > span { padding: 3px 7px; color: #9ba5ad; background: #f4f5f6; border: 1px solid #e7eaed; border-radius: 5px; font-size: 10px; }
.search-results { position: absolute; left: 0; right: 0; top: 46px; display: none; max-height: 360px; padding: 8px; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); overflow: auto; }
.search-results.show { display: block; }
.search-results a { display: flex; justify-content: space-between; gap: 12px; padding: 10px; border-radius: 8px; }
.search-results a:hover { background: #f5f7fa; }
.search-results small { color: var(--muted); }
.top-actions { display: flex; align-items: center; gap: 12px; }
.top-icon { width: 40px; height: 40px; display: grid; place-items: center; position: relative; color: #697985; background: #fff; border: 1px solid #e4e9ec; border-radius: 11px; }
.top-icon i { width: 7px; height: 7px; position: absolute; right: 8px; top: 7px; background: #ef646b; border: 2px solid #fff; border-radius: 50%; }
.content-wrap { max-width: 1500px; margin: 0 auto; padding: 32px 34px 58px; }

.btn { min-height: 40px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 17px; border: 1px solid transparent; border-radius: 10px; background: transparent; font-weight: 600; white-space: nowrap; transition: .18s; }
.btn svg { width: 17px; height: 17px; }
.btn:hover { transform: translateY(-1px); }
.btn-primary { color: #fff; background: var(--blue); border-color: var(--blue); box-shadow: 0 7px 15px rgba(65,105,225,.2); }
.btn-primary:hover { background: #345bcf; }
.btn-dark { color: #fff; background: var(--navy); border-color: var(--navy); }
.btn-outline { color: #41515d; background: #fff; border-color: #dfe4e8; }
.btn-outline:hover { color: var(--blue); border-color: #aabcf1; }
.btn-text { color: #74818b; }
.btn-text:hover { color: var(--ink); background: #eef1f3; }
.btn-sm { min-height: 34px; padding: 0 13px; font-size: 12px; border-radius: 8px; }
.btn-lg { min-height: 47px; padding: 0 24px; }
.btn-block { width: 100%; }
.btn.danger, .danger { color: var(--red); }
.icon-btn { width: 34px; height: 34px; display: inline-grid; place-items: center; padding: 0; color: #7a8790; background: transparent; border: 0; border-radius: 8px; transition: .18s; }
.icon-btn:hover { color: var(--blue); background: #edf2ff; }
.icon-btn.primary { color: #fff; background: var(--blue); }
.icon-btn:disabled { opacity: .25; cursor: not-allowed; }
.mobile-menu { display: none; padding: 0; border: 0; background: transparent; }

.page-heading, .detail-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 25px; margin-bottom: 26px; }
.page-heading h1, .detail-heading h1 { margin: 5px 0 7px; font-size: 28px; line-height: 1.25; letter-spacing: -.7px; }
.page-heading p, .detail-heading p { margin: 0; color: var(--muted); }
.eyebrow { color: #72808b; font-size: 10px; font-weight: 700; letter-spacing: 1.5px; }
.eyebrow.light { color: #8fa9b9; }
.dashboard-heading { align-items: center; }
.dashboard-heading h1 { font-size: 30px; }
.back-link { display: inline-flex; align-items: center; gap: 5px; margin-bottom: 12px; color: #74818b; font-size: 12px; }
.back-link:hover { color: var(--blue); }
.back-link svg { width: 15px; }
.page-heading .back-link + .eyebrow { display: block; }
.card { background: var(--surface); border: 1px solid rgba(223,228,232,.9); border-radius: var(--radius); box-shadow: 0 3px 13px rgba(20,43,58,.025); }
.card-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 24px 18px; }
.card-header h2 { margin: 0 0 5px; font-size: 16px; }
.card-header p { margin: 0; color: var(--muted); font-size: 11px; }
.card-header a { display: inline-flex; align-items: center; gap: 3px; color: #6d7b85; font-size: 11px; }
.card-header a svg { width: 14px; }
.tiny-badge { padding: 4px 8px; color: var(--green); background: #eaf8f2; border-radius: 8px; font-size: 10px; }

.stat-grid { display: grid; grid-template-columns: 1.2fr repeat(3, 1fr); gap: 15px; margin-bottom: 17px; }
.stat-card { min-height: 142px; padding: 20px 21px; position: relative; background: #fff; border: 1px solid #e4e9ec; border-radius: 15px; overflow: hidden; }
.stat-card .stat-top { display: flex; align-items: center; justify-content: space-between; color: #6f7d87; font-size: 12px; }
.stat-card .stat-top i { width: 32px; height: 32px; display: grid; place-items: center; color: var(--blue); background: var(--blue-soft); border-radius: 9px; font-style: normal; }
.stat-card .stat-top i.green { color: var(--green); background: #eaf8f2; }
.stat-card .stat-top i.orange { color: var(--orange); background: #fff5e5; }
.stat-card .stat-top i svg { width: 16px; }
.stat-card > strong { display: block; margin: 12px 0 7px; color: #172a36; font-family: Arial, sans-serif; font-size: 27px; letter-spacing: -.5px; }
.stat-card > small { color: #8a959d; font-size: 10px; }
.stat-card > small b { color: #51626e; }
.stat-dark { color: #fff; background: linear-gradient(135deg, #17394d 0%, #102a3c 100%); border-color: transparent; }
.stat-dark .stat-top { color: #a9bdc9; }
.stat-dark .stat-top i { color: #b8caff; background: rgba(255,255,255,.08); }
.stat-dark > strong { color: #fff; }
.stat-dark > small { color: #87a1b1; }
.stat-decoration { width: 100px; height: 100px; position: absolute; right: -28px; bottom: -45px; border: 18px solid rgba(85,126,234,.12); border-radius: 50%; }
.dashboard-grid { display: grid; grid-template-columns: 1.55fr 1fr; gap: 17px; margin-bottom: 17px; }
.task-list { padding: 0 10px 10px; }
.task-item { min-height: 67px; display: flex; align-items: center; gap: 13px; padding: 10px 13px; border-top: 1px solid #eff1f3; border-radius: 9px; transition: .18s; }
.task-item:hover { background: #f8fafb; }
.date-block { width: 42px; height: 42px; display: grid; place-content: center; text-align: center; background: #eff4ff; border-radius: 10px; }
.date-block strong { color: #4169d9; font-size: 15px; line-height: 1; }
.date-block small { margin-top: 3px; color: #7890c5; font-size: 9px; }
.date-block.overdue { background: #fff0f1; }
.date-block.overdue strong { color: var(--red); }
.task-main { min-width: 0; flex: 1; }
.task-main strong, .task-main em { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.task-main strong { font-size: 13px; }
.task-main strong small { margin-left: 6px; color: #89949b; font-size: 10px; font-weight: 400; }
.task-main em { margin-top: 5px; color: #73808a; font-size: 10px; font-style: normal; }
.task-item > svg { width: 15px; color: #aeb7bd; }
.badge { display: inline-flex; align-items: center; padding: 4px 8px; border-radius: 7px; font-size: 10px; font-style: normal; }
.level-a { color: #c87439; background: #fff1e5; }
.level-b { color: #3d68cf; background: #edf2ff; }
.level-c { color: #71818c; background: #eff2f4; }
.funnel-chart { padding: 5px 24px 20px; }
.bar-row { display: grid; grid-template-columns: 55px 1fr 25px; align-items: center; gap: 12px; margin: 17px 0; }
.bar-row > span { color: #687681; font-size: 11px; }
.bar-row > div { height: 7px; background: #edf0f2; border-radius: 8px; overflow: hidden; }
.bar-row > div i { display: block; height: 100%; border-radius: inherit; }
.bar-row strong { text-align: right; font-size: 12px; }
.funnel-note { display: flex; align-items: flex-start; gap: 10px; margin: 0 20px 20px; padding: 12px 13px; background: #f7f9fb; border-radius: 10px; }
.funnel-note > span { width: 26px; height: 26px; display: grid; place-items: center; flex: none; color: #6682d5; background: #e9efff; border-radius: 8px; }
.funnel-note svg { width: 14px; }
.funnel-note p { margin: 0; color: #77848d; font-size: 9px; line-height: 1.6; }
.funnel-note strong { display: block; color: #4e5d68; font-size: 10px; }
.activity-card { margin-bottom: 10px; }
.activity-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 22px; padding: 0 24px 16px; }
.activity-item { display: flex; align-items: flex-start; gap: 11px; padding: 13px 0; border-top: 1px solid #edf0f2; }
.activity-item > span:nth-child(2) { min-width: 0; flex: 1; color: #76838d; font-size: 11px; }
.activity-item > span strong { color: #273641; }
.activity-item > span b { color: #4168ca; }
.activity-item p { margin: 5px 0 0; overflow: hidden; color: #6e7c85; white-space: nowrap; text-overflow: ellipsis; }
.activity-item time { color: #a2abb1; font-size: 9px; white-space: nowrap; }

.filter-card { margin-bottom: 15px; border-radius: 13px; }
.filter-form { display: flex; align-items: center; gap: 10px; padding: 14px; }
.filter-form select, .filter-form input { height: 40px; border: 1px solid #e1e6e9; border-radius: 9px; outline: 0; background: #fff; }
.filter-form select { min-width: 130px; padding: 0 30px 0 12px; color: #52616c; }
.filter-search { min-width: 220px; height: 40px; display: flex; align-items: center; gap: 8px; flex: 1; padding: 0 12px; border: 1px solid #e1e6e9; border-radius: 9px; }
.filter-search.wide { max-width: 540px; }
.filter-search svg { width: 16px; color: #8c98a0; }
.filter-search input { min-width: 0; flex: 1; padding: 0; border: 0; }
.table-card { overflow: hidden; }
.table-summary { min-height: 52px; display: flex; align-items: center; justify-content: space-between; padding: 0 20px; color: #7b8790; border-bottom: 1px solid #edf0f2; font-size: 11px; }
.table-summary strong { color: #31434f; }
.scope-note { display: inline-flex; align-items: center; gap: 5px; color: #6e7db1; }
.scope-note.open { color: var(--green); }
.scope-note svg { width: 13px; }
.responsive-table { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th { padding: 13px 16px; color: #89949b; background: #fafbfc; border-bottom: 1px solid #e9edef; font-size: 10px; font-weight: 500; text-align: left; white-space: nowrap; }
td { padding: 14px 16px; border-bottom: 1px solid #eef1f2; color: #53616c; font-size: 11px; vertical-align: middle; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #fbfcfd; }
.customer-cell { min-width: 170px; display: flex; align-items: center; gap: 11px; }
.customer-avatar { width: 36px; height: 36px; display: inline-grid; place-items: center; flex: none; border-radius: 10px; font-weight: 700; }
.customer-avatar.large { width: 55px; height: 55px; border-radius: 15px; font-size: 19px; }
.color-0 { color: #4e65ae; background: #e7ecfa; }.color-1 { color: #a46242; background: #faebe2; }.color-2 { color: #357b69; background: #e3f4ef; }.color-3 { color: #785d9f; background: #f0e8f7; }.color-4 { color: #9c793b; background: #faf1dc; }
.customer-cell strong, .customer-cell small { display: block; }
.customer-cell strong { color: #263640; font-size: 12px; }
.customer-cell small { max-width: 180px; margin-top: 5px; color: #8a959c; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.level-dot { margin-left: 3px; padding: 2px 4px; border-radius: 4px; font-size: 8px; font-style: normal; }
.cell-main, .cell-sub { display: block; white-space: nowrap; }
.cell-main { color: #475661; }
.cell-sub { margin-top: 5px; color: #929ca3; font-size: 9px; }
.status { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; border-radius: 7px; font-size: 10px; white-space: nowrap; }
.status i { width: 5px; height: 5px; border-radius: 50%; }
.status-lead { color: #617787; background: #edf2f5; }.status-lead i { background: #8298a6; }
.status-following { color: #3e66c7; background: #edf2ff; }.status-following i { background: #4d75db; }
.status-won { color: #27835f; background: #eaf8f2; }.status-won i { background: #2ca879; }
.status-paused { color: #9b702c; background: #fff5e5; }.status-paused i { background: #e4a33c; }
.status-lost { color: #9b6870; background: #f8edef; }.status-lost i { background: #ca7580; }
.status-public { color: #785b9b; background: #f1eafa; }.status-public i { background: #8b69b3; }
.owner-chip { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
.owner-chip > span { width: 25px; height: 25px; display: inline-grid; place-items: center; color: #4562a5; background: #e8eefc; border-radius: 50%; font-size: 9px; }
.row-action { width: 55px; text-align: right; }
.row-action > svg { color: #35a879; }
.row-buttons { display: flex; justify-content: flex-end; align-items: center; gap: 2px; }
.pool-count { display: flex; align-items: center; gap: 9px; }
.pool-count strong { font-size: 27px; }
.pool-count small { max-width: 50px; color: var(--muted); font-size: 10px; line-height: 1.3; }
.pool-banner, .permission-banner { display: flex; align-items: center; gap: 15px; margin-bottom: 15px; padding: 15px 18px; color: #516477; background: linear-gradient(90deg, #eef3ff, #f7f9ff); border: 1px solid #dee7fc; border-radius: 12px; }
.pool-banner > span, .permission-banner > svg { width: 36px; height: 36px; display: grid; place-items: center; flex: none; color: #4c70c8; }
.pool-banner strong, .permission-banner strong { color: #34506c; font-size: 12px; }
.pool-banner p, .permission-banner p { margin: 4px 0 0; font-size: 10px; line-height: 1.5; }

.form-layout { display: grid; gap: 15px; max-width: 1040px; }
.form-card { padding: 25px; }
.form-section-title { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 23px; }
.form-section-title > span { width: 29px; height: 29px; display: grid; place-items: center; flex: none; color: #4a6dcc; background: #edf2ff; border-radius: 8px; font-size: 10px; font-weight: 700; }
.form-section-title h2 { margin: 0 0 5px; font-size: 16px; }
.form-section-title p { margin: 0; color: #8a959d; font-size: 10px; }
.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
label { display: block; }
label > span { display: block; margin-bottom: 8px; color: #596873; font-size: 11px; font-weight: 600; }
input, select, textarea { width: 100%; color: #2a3943; background: #fff; border: 1px solid #dfe5e8; border-radius: 9px; outline: 0; transition: .18s; }
input, select { height: 42px; padding: 0 12px; }
textarea { padding: 11px 12px; resize: vertical; line-height: 1.65; }
input:focus, select:focus, textarea:focus { border-color: #90a7e9; box-shadow: 0 0 0 3px rgba(65,105,225,.08); }
input::placeholder, textarea::placeholder { color: #b3bbc0; }
.span-2 { grid-column: 1 / -1; }
.form-actions { display: flex; justify-content: flex-end; align-items: center; gap: 8px; padding: 3px 0 20px; }

.detail-heading { align-items: center; flex-wrap: wrap; }
.detail-heading > .back-link { flex-basis: 100%; margin-bottom: -5px; }
.detail-title { display: flex; align-items: center; gap: 14px; }
.title-line { display: flex; align-items: center; gap: 8px; }
.title-line h1 { margin: 0; }
.detail-title p { margin-top: 6px; }
.detail-actions { display: flex; align-items: center; gap: 8px; }
.detail-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 17px; }
.detail-main { display: grid; align-content: start; gap: 17px; }
.detail-side { display: grid; align-content: start; gap: 15px; }
.info-card { padding-bottom: 22px; }
.info-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px 16px; padding: 2px 24px 22px; }
.info-item { display: flex; align-items: center; gap: 11px; }
.info-item > span { width: 34px; height: 34px; display: grid; place-items: center; flex: none; color: #647b94; background: #f0f4f7; border-radius: 9px; }
.info-item svg { width: 16px; }
.info-item small, .info-item strong { display: block; }
.info-item small { margin-bottom: 4px; color: #8a959d; font-size: 9px; }
.info-item strong { color: #384954; font-size: 11px; word-break: break-all; }
.intent-box { margin: 0 24px 14px; padding: 13px 15px; background: #f6f8fa; border-radius: 10px; }
.intent-box span { color: #8b969d; font-size: 9px; }
.intent-box p { margin: 5px 0 0; color: #465660; font-size: 11px; }
.note-box { display: flex; gap: 12px; margin: 0 24px; padding: 14px 15px; color: #6c6042; background: #fff9e9; border: 1px solid #f5eac9; border-radius: 10px; }
.note-box > svg { width: 17px; flex: none; color: #c59a3e; }
.note-box strong { font-size: 10px; }
.note-box p { margin: 5px 0 0; font-size: 10px; line-height: 1.7; }
.timeline { padding: 0 24px 16px 43px; }
.timeline-item { padding: 0 0 24px 22px; position: relative; border-left: 1px solid #dfe5e8; }
.timeline-item:last-child { padding-bottom: 5px; border-color: transparent; }
.timeline-dot { width: 9px; height: 9px; position: absolute; left: -5px; top: 4px; background: #4a72dd; border: 2px solid #dce5ff; border-radius: 50%; box-sizing: content-box; }
.timeline-head { display: flex; justify-content: space-between; gap: 10px; }
.timeline-head strong { color: #354752; font-size: 11px; }
.timeline-head time { color: #9aa3a9; font-size: 9px; }
.timeline-item p { margin: 8px 0; color: #596873; font-size: 11px; line-height: 1.7; }
.timeline-item small { color: #98a1a7; font-size: 9px; }
.inline-form { margin: 17px 24px 24px; padding: 19px; background: #f7f9fb; border: 1px solid #e7ebee; border-radius: 12px; }
.inline-form-title { display: flex; align-items: baseline; gap: 9px; margin-bottom: 17px; }
.inline-form-title strong { font-size: 12px; }
.inline-form-title span { color: #8d989f; font-size: 9px; }
.inline-form .btn { margin-top: 15px; }
.owner-card { padding: 19px; }
.side-label { color: #89949b; font-size: 9px; letter-spacing: .7px; }
.owner-profile { display: flex; align-items: center; gap: 10px; margin: 13px 0 18px; }
.owner-profile strong, .owner-profile small { display: block; }
.owner-profile strong { font-size: 12px; }
.owner-profile small { margin-top: 4px; color: #8b969d; font-size: 9px; }
.mini-info { display: grid; grid-template-columns: 1fr 1fr; padding-top: 14px; border-top: 1px solid #eef1f2; }
.mini-info span { color: #929ca2; font-size: 9px; }
.mini-info strong { display: block; margin-top: 5px; color: #44545e; font-size: 10px; }
.payment-mini-list { padding: 0 18px 15px; }
.payment-mini { padding: 13px 0; border-top: 1px solid #edf0f2; }
.payment-mini > div { display: flex; justify-content: space-between; gap: 8px; }
.payment-mini strong { font-size: 10px; }
.payment-mini p { margin: 8px 0 4px; color: #7c8890; font-size: 10px; }
.payment-mini p b { color: #26906a; }
.payment-mini small { color: #9aa3a9; font-size: 9px; }
.payment-status { display: inline-flex; padding: 4px 7px; border-radius: 6px; font-size: 9px; white-space: nowrap; }
.payment-unpaid { color: #a56f29; background: #fff3df; }.payment-partial { color: #4e6cb5; background: #edf2ff; }.payment-paid { color: #23835e; background: #e8f7f1; }.payment-overdue { color: #b54d55; background: #fcecee; }
.side-form { display: grid; gap: 12px; margin: 0 16px 17px; padding: 15px; background: #f7f9fb; border-radius: 11px; }
.side-form input, .side-form select { height: 37px; font-size: 10px; }
.side-form label > span { margin-bottom: 6px; font-size: 9px; }
.two-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.danger-zone { display: flex; justify-content: center; gap: 10px; padding: 5px; }
.danger-zone .btn { font-size: 10px; }

.money-summary { display: grid; grid-template-columns: repeat(3, 1fr) 1.35fr; gap: 1px; margin-bottom: 15px; overflow: hidden; background: #e7ebee; border: 1px solid #e4e8eb; border-radius: 14px; }
.money-summary > div { min-height: 91px; padding: 18px 20px; background: #fff; }
.money-summary span, .money-summary strong { display: block; }
.money-summary span { color: #81909a; font-size: 10px; }
.money-summary strong { margin-top: 9px; font-family: Arial, sans-serif; font-size: 21px; }
.green-text { color: var(--green)!important; }.orange-text { color: var(--orange)!important; }.danger-text { color: var(--red)!important; }
.progress-summary span { display: flex; justify-content: space-between; color: #657681; }
.progress-summary > div { height: 8px; margin-top: 19px; overflow: hidden; background: #edf0f2; border-radius: 8px; }
.progress-summary > div i { display: block; height: 100%; background: linear-gradient(90deg, #345dcc, #53a4d4); border-radius: inherit; }
.tab-filter { display: flex; gap: 4px; padding: 9px; }
.tab-filter a { padding: 9px 14px; color: #77848d; border-radius: 8px; font-size: 11px; }
.tab-filter a.active { color: #345fc6; background: #edf2ff; font-weight: 600; }
.cell-link strong, .cell-link small { display: block; }
.cell-link strong { color: #31434e; font-size: 11px; }
.cell-link small { margin-top: 5px; color: #929ca3; font-size: 9px; }
.amount { color: #293b46; font-family: Arial, sans-serif; font-size: 13px; font-weight: 600; }

.reminder-hero { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 17px; padding: 22px 25px; color: #e8f0f5; background: linear-gradient(120deg, #17384b, #1b4258); border-radius: 15px; box-shadow: var(--shadow); }
.reminder-hero > div:first-child { display: flex; align-items: center; gap: 14px; }
.reminder-icon { width: 45px; height: 45px; display: grid; place-items: center; background: rgba(255,255,255,.09); border-radius: 13px; }
.reminder-hero strong { font-size: 26px; }
.reminder-hero p { margin: 2px 0 0; color: #91a9b7; font-size: 10px; }
.reminder-split { display: flex; align-items: center; gap: 22px; }
.reminder-split span { color: #9db0bc; font-size: 10px; }
.reminder-split b { margin-left: 4px; color: #fff; }
.reminder-split i { width: 6px; height: 6px; display: inline-block; margin-right: 5px; border-radius: 50%; }
.red-dot { background: #ef6670; }.orange-dot { background: #eda342; }.blue-dot { background: #668df2; }
.reminder-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; }
.reminder-list { padding: 0 17px 17px; }
.reminder-list a { min-height: 64px; display: flex; align-items: center; gap: 12px; padding: 10px 7px; border-top: 1px solid #edf0f2; border-radius: 8px; }
.reminder-list a:hover { background: #f8fafb; }
.reminder-list a > span:nth-child(2) { min-width: 0; flex: 1; }
.reminder-list strong, .reminder-list small { display: block; }
.reminder-list strong { color: #354650; font-size: 11px; }
.reminder-list small { margin-top: 5px; color: #8e989f; font-size: 9px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.reminder-list em { color: #73818a; font-size: 9px; font-style: normal; white-space: nowrap; }
.reminder-date { width: 40px; height: 40px; display: grid; place-content: center; text-align: center; color: #5270b8; background: #edf2ff; border-radius: 9px; }
.reminder-date strong { color: inherit; font-size: 14px; line-height: 1; }
.reminder-date small { margin-top: 3px; color: inherit; }
.reminder-date.urgent { color: #ba7827; background: #fff2de; }.reminder-date.late { color: #bc4f58; background: #fcebee; }

.role-badge { display: inline-flex; align-items: center; gap: 5px; padding: 5px 8px; border-radius: 7px; font-size: 9px; white-space: nowrap; }
.role-badge svg { width: 12px; }
.role-admin { color: #704f9a; background: #f1eafa; }.role-sales { color: #3c68ca; background: #edf2ff; }.role-sales_manager { color: #a16b26; background: #fff2de; }.role-project { color: #298064; background: #e9f7f2; }.role-finance { color: #736439; background: #f7f1df; }
.user-form { max-width: 700px; margin-top: 17px; padding: 0 23px 20px; }
.user-form .card-header { padding-left: 0; padding-right: 0; }
.permission-banner > svg { padding: 8px; background: #e1e9ff; border-radius: 10px; }

.empty { min-height: 300px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 35px; color: #8b969e; text-align: center; }
.empty > svg { width: 37px; height: 37px; margin-bottom: 13px; color: #a7b4bd; }
.empty h3 { margin-bottom: 7px; color: #4e5e68; font-size: 15px; }
.empty p { margin-bottom: 16px; font-size: 10px; }
.empty.compact { min-height: 140px; }
.empty.compact > svg { width: 28px; }
.alert { display: flex; align-items: center; gap: 9px; padding: 11px 13px; border-radius: 9px; font-size: 11px; }
.alert svg { width: 16px; flex: none; }
.alert.success { color: #287659; background: #eaf7f2; border: 1px solid #d3eee4; }
.alert.error { color: #a7474e; background: #fbecef; border: 1px solid #f3d9dd; }
.alert.floating { margin: -13px 0 20px; box-shadow: 0 7px 20px rgba(25,45,56,.06); }
.alert.floating span { flex: 1; }
.alert.floating button { border: 0; color: inherit; background: transparent; font-size: 18px; }
.hidden { display: none!important; }

.login-body { min-height: 100vh; background: #e9eef1; }
.login-shell { width: min(1100px, calc(100vw - 42px)); min-height: 650px; display: grid; grid-template-columns: 1.08fr .92fr; margin: max(30px, 5vh) auto; overflow: hidden; background: #fff; border-radius: 23px; box-shadow: 0 28px 80px rgba(19,42,57,.15); }
.login-brand { min-height: 650px; padding: 46px 50px; position: relative; color: #fff; background: linear-gradient(145deg, #122e40 0%, #173c50 58%, #18364a 100%); overflow: hidden; }
.login-brand::after { content: ""; width: 430px; height: 430px; position: absolute; right: -240px; bottom: -220px; border: 1px solid rgba(119,155,180,.25); border-radius: 50%; box-shadow: 0 0 0 55px rgba(85,125,151,.04), 0 0 0 110px rgba(85,125,151,.025); }
.login-brand-top { display: flex; align-items: center; gap: 12px; position: relative; z-index: 2; color: #dce8ee; font-size: 11px; letter-spacing: 2.2px; }
.brand-mark-large { width: 35px; height: 35px; border-radius: 10px; }
.login-copy { max-width: 460px; margin-top: 120px; position: relative; z-index: 2; }
.login-copy h1 { margin: 16px 0 22px; font-size: 43px; line-height: 1.32; letter-spacing: -1.5px; }
.login-copy p { max-width: 400px; color: #9bb1bd; font-size: 13px; line-height: 1.85; }
.login-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; position: absolute; left: 50px; right: 50px; bottom: 55px; z-index: 2; }
.login-metrics > div { padding-top: 14px; border-top: 1px solid rgba(255,255,255,.13); }
.login-metrics strong, .login-metrics span { display: block; }
.login-metrics strong { color: #e9f0f4; font-size: 13px; }
.login-metrics span { margin-top: 6px; color: #718b9b; font-size: 9px; }
.login-orbit { position: absolute; border: 1px solid rgba(91,133,158,.13); border-radius: 50%; }
.orbit-one { width: 280px; height: 280px; right: -140px; top: -100px; }.orbit-two { width: 160px; height: 160px; right: -70px; top: -40px; }
.login-panel { display: grid; place-items: center; padding: 50px; }
.login-form-wrap { width: min(330px, 100%); }
.login-form-wrap h2 { margin: 10px 0 8px; font-size: 27px; }
.subtle { color: #88949c; font-size: 11px; }
.login-form-wrap .alert { margin: 18px 0 3px; }
.login-form { display: grid; gap: 18px; margin-top: 27px; }
.input-with-icon { height: 44px; display: flex; align-items: center; gap: 9px; padding: 0 12px; border: 1px solid #dfe5e8; border-radius: 10px; }
.input-with-icon:focus-within { border-color: #8ea6e9; box-shadow: 0 0 0 3px rgba(65,105,225,.08); }
.input-with-icon svg { width: 16px; color: #89969e; }
.input-with-icon input { height: auto; padding: 0; border: 0; box-shadow: none; }
.btn-login { min-height: 46px; margin-top: 4px; }
.demo-account { display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 25px; color: #8d989f; font-size: 9px; }
.demo-account code { padding: 3px 6px; color: #52606a; background: #f1f3f4; border-radius: 5px; }
.demo-account i { color: #bcc3c7; font-style: normal; }
.login-tip { margin: 11px 0 0; color: #a1abb1; font-size: 9px; text-align: center; }
.mobile-brand { display: none; }
.mobile-overlay { display: none; }

.heading-actions { display: flex; align-items: center; gap: 8px; }
.check-label { display: flex; align-items: center; gap: 9px; margin-top: 17px; cursor: pointer; }
.check-label input { width: 16px; height: 16px; margin: 0; }
.check-label > span { margin: 0; font-weight: 400; }
.detail-tabs { display: flex; align-items: center; gap: 4px; margin: -4px 0 18px; padding: 7px; overflow-x: auto; background: #fff; border: 1px solid #e2e7ea; border-radius: 13px; scrollbar-width: none; }
.detail-tabs::-webkit-scrollbar { display: none; }
.detail-tabs a { min-height: 39px; display: flex; align-items: center; gap: 7px; padding: 0 13px; color: #70808b; border-radius: 9px; font-size: 11px; white-space: nowrap; transition: .18s; }
.detail-tabs a:hover { color: #3c5c9f; background: #f4f7fa; }
.detail-tabs a.active { color: #315abf; background: #edf2ff; font-weight: 600; }
.detail-tabs svg { width: 15px; }
.detail-tabs em { min-width: 18px; height: 18px; display: grid; place-items: center; padding: 0 5px; color: #71809b; background: #e3e8f1; border-radius: 9px; font-size: 9px; font-style: normal; }
.detail-tabs a.active em { color: #fff; background: #5676d1; }
.detail-side.single-column { grid-template-columns: 1fr; }
.value-card { padding: 19px; }
.value-card > strong { display: block; margin: 12px 0; font-size: 23px; }
.value-card > p { margin: 9px 0 16px; color: #859199; font-size: 9px; }
.value-progress { height: 7px; overflow: hidden; background: #edf1f3; border-radius: 7px; }
.value-progress i { display: block; height: 100%; background: linear-gradient(90deg, #3f66cf, #54a7ce); border-radius: inherit; }
.value-metrics { display: grid; grid-template-columns: 1fr 1fr; padding-top: 13px; border-top: 1px solid #edf0f2; }
.value-metrics span { color: #859199; font-size: 9px; }
.value-metrics b { display: block; margin-bottom: 4px; color: #344650; font-size: 15px; }
.tab-layout { display: grid; grid-template-columns: minmax(0,1fr) 310px; gap: 17px; align-items: start; }
.tab-content-card { overflow: hidden; }
.tab-content-card.narrow { max-width: 980px; }
.tab-side-form { display: grid; gap: 13px; padding: 20px; }
.tab-side-form h2 { margin-bottom: 6px; font-size: 15px; }
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; padding: 0 20px 20px; }
.contact-card { padding: 17px; position: relative; background: #f9fafb; border: 1px solid #e8ecef; border-radius: 12px; }
.contact-card > div:first-child { display: flex; align-items: center; gap: 10px; }
.contact-card > div:first-child > span:nth-child(2) { flex: 1; }
.contact-card strong, .contact-card small { display: block; }
.contact-card strong { color: #334550; font-size: 12px; }
.contact-card strong em { margin-left: 6px; padding: 3px 6px; color: #397360; background: #e4f3ed; border-radius: 5px; font-size: 8px; font-style: normal; }
.contact-card small { margin-top: 4px; color: #89949b; font-size: 9px; }
.contact-card dl { display: grid; grid-template-columns: 1fr 1fr; gap: 13px 15px; margin: 17px 0 0; padding-top: 14px; border-top: 1px solid #e7ebed; }
.contact-card dt { color: #9aa3a9; font-size: 8px; }
.contact-card dd { margin: 4px 0 0; color: #52616b; font-size: 10px; word-break: break-all; }
.contact-card > p { margin: 13px 0 0; padding: 9px; color: #756b50; background: #fff8e8; border-radius: 7px; font-size: 9px; line-height: 1.6; }
.contact-card > form { position: absolute; right: 8px; top: 8px; }
.large-timeline { max-width: 920px; padding-top: 6px; }
.result-tag { margin-left: 6px; padding: 3px 7px; color: #496ab4; background: #eaf0ff; border-radius: 6px; font-size: 8px; font-style: normal; font-weight: 400; }
.project-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; padding: 0 20px 20px; }
.project-card { padding: 18px; background: #fbfcfd; border: 1px solid #e5eaed; border-radius: 13px; }
.project-card-head { display: flex; align-items: center; gap: 10px; }
.project-icon { width: 37px; height: 37px; display: grid; place-items: center; flex: none; color: #4568c3; background: #eaf0ff; border-radius: 10px; }
.project-icon svg { width: 17px; }
.project-card-head > div { min-width: 0; flex: 1; }
.project-card-head small { color: #909ba2; font-size: 8px; }
.project-card-head h3 { margin: 4px 0 0; overflow: hidden; color: #32444f; font-size: 12px; white-space: nowrap; text-overflow: ellipsis; }
.project-status { display: inline-flex; padding: 4px 7px; border-radius: 6px; font-size: 9px; white-space: nowrap; }
.project-pending { color: #6e7c86; background: #edf1f3; }.project-developing { color: #3c65c9; background: #eaf0ff; }.project-testing { color: #9468a4; background: #f2eafa; }.project-acceptance { color: #aa742c; background: #fff2de; }.project-online { color: #23825f; background: #e7f6f0; }.project-maintenance { color: #347a85; background: #e5f4f5; }
.project-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; margin: 17px 0; }
.project-meta span { color: #939da3; font-size: 8px; }
.project-meta strong { display: block; margin-top: 5px; color: #4a5a64; font-size: 10px; }
.project-progress > span { display: flex; justify-content: space-between; color: #6f7d87; font-size: 9px; }
.project-progress > div, .table-progress { height: 6px; margin-top: 8px; overflow: hidden; background: #e8edef; border-radius: 6px; }
.project-progress i, .table-progress i { display: block; height: 100%; background: linear-gradient(90deg, #4268d3, #55a6ce); border-radius: inherit; }
.project-card > p { margin: 13px 0 0; color: #79868e; font-size: 9px; line-height: 1.6; }
.project-quick { display: flex; gap: 7px; margin-top: 14px; padding-top: 13px; border-top: 1px solid #e7ebed; }
.project-quick select { flex: 1; height: 33px; font-size: 9px; }
.project-quick input[type=number] { width: 62px; height: 33px; font-size: 9px; }
.table-progress { width: 90px; display: inline-block; margin: 0 7px 0 0; vertical-align: middle; }
.finance-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-bottom: 14px; }
.finance-summary > div { padding: 16px 18px; background: #fff; border: 1px solid #e3e8eb; border-radius: 12px; }
.finance-summary span, .finance-summary strong { display: block; }
.finance-summary span { color: #849099; font-size: 9px; }
.finance-summary strong { margin-top: 7px; font-size: 18px; }
.contract-layout { display: grid; grid-template-columns: minmax(0,1fr) 310px; gap: 17px; align-items: start; }
.contract-forms { display: grid; gap: 14px; }
.contract-list { padding: 0 20px 7px; }
.contract-list article { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 16px 4px; border-top: 1px solid #edf0f2; }
.contract-list article > div:first-child { display: flex; align-items: center; gap: 11px; }
.contract-icon { width: 36px; height: 36px; display: grid; place-items: center; flex: none; color: #5572ad; background: #edf2fa; border-radius: 9px; }
.contract-icon svg { width: 16px; }
.contract-list small { color: #929ba1; font-size: 8px; }
.contract-list h3 { margin: 4px 0; color: #354751; font-size: 11px; }
.contract-list p { margin: 0; color: #849099; font-size: 9px; }
.contract-money { text-align: right; }
.contract-money strong, .contract-money span { display: block; }
.contract-money strong { color: #2a3c47; font-size: 13px; }
.contract-money span { margin-top: 5px; color: #329271; font-size: 9px; }
.plan-table { padding: 9px 20px 20px; border-top: 1px solid #edf0f2; }
.plan-table > h3 { font-size: 12px; }
.receive-form { width: 250px; display: flex; gap: 5px; margin-top: 7px; padding: 7px; position: absolute; right: 14px; z-index: 5; background: #fff; border: 1px solid #dfe5e8; border-radius: 9px; box-shadow: var(--shadow); }
.receive-form input { height: 32px; font-size: 9px; }
.receive-form input[type=number] { width: 90px; }
.ticket-list { padding: 0 20px 20px; }
.ticket-list article { display: flex; align-items: flex-start; gap: 13px; padding: 16px 7px; position: relative; border-top: 1px solid #edf0f2; }
.ticket-priority { width: 4px; align-self: stretch; flex: none; background: #9da8ae; border-radius: 5px; }
.priority-low { color: #657985; background: #dce4e8!important; }.priority-normal { color: #4166bf; background: #7190db!important; }.priority-high { color: #a06d29; background: #e6a443!important; }.priority-urgent { color: #b34e56; background: #df626b!important; }
.ticket-main { min-width: 0; flex: 1; }
.ticket-main small { color: #909ba2; font-size: 8px; }
.ticket-main h3 { margin: 5px 0; color: #354751; font-size: 12px; }
.ticket-main p { max-width: 650px; margin: 0; color: #75828b; font-size: 9px; line-height: 1.6; }
.ticket-meta { display: grid; justify-items: end; gap: 6px; min-width: 110px; }
.ticket-meta small { color: #8f999f; font-size: 8px; }
.ticket-status, .priority-label { display: inline-flex; padding: 4px 7px; border-radius: 6px; font-size: 9px; }
.ticket-open { color: #a36f2f; background: #fff2de; }.ticket-processing { color: #3d66c5; background: #eaf0ff; }.ticket-waiting { color: #82629b; background: #f1eafa; }.ticket-resolved { color: #267f60; background: #e6f5ef; }.ticket-closed { color: #6f7d85; background: #edf1f3; }
.ticket-quick { display: flex; gap: 5px; align-self: center; }
.ticket-quick select { width: 110px; height: 33px; font-size: 9px; }
.ticket-quick-stack { display: grid; gap: 7px; align-self: center; }
.attachment-list { padding: 0 20px 20px; }
.attachment-list article { display: flex; align-items: center; gap: 11px; padding: 14px 5px; border-top: 1px solid #edf0f2; }
.file-icon { width: 37px; height: 37px; display: grid; place-items: center; flex: none; color: #4f70b8; background: #edf2fc; border-radius: 9px; }
.file-icon svg { width: 17px; }
.attachment-list article > div { min-width: 0; flex: 1; }
.attachment-list strong, .attachment-list small { display: block; }
.attachment-list strong { overflow: hidden; color: #394b56; font-size: 11px; white-space: nowrap; text-overflow: ellipsis; }
.attachment-list small { margin-top: 5px; color: #8c979e; font-size: 8px; }
.upload-drop { cursor: pointer; }
.upload-drop > input { width: 1px; height: 1px; position: absolute; opacity: 0; }
.upload-drop > span { min-height: 130px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 15px; color: #84919a; background: #f8fafb; border: 1px dashed #cfd8dd; border-radius: 11px; text-align: center; }
.upload-drop svg { margin-bottom: 8px; color: #5877c7; }
.upload-drop b { color: #53636e; font-size: 10px; }
.upload-drop small { max-width: 430px; margin-top: 6px; color: #98a2a8; font-size: 8px; line-height: 1.6; }
.import-form { margin: 17px 0; padding: 0 22px 22px; }
.import-form .card-header { padding-left: 0; padding-right: 0; }
.import-body { display: grid; grid-template-columns: minmax(0,1fr) 220px auto; align-items: end; gap: 13px; }
.report-period { color: #75838c; font-size: 10px; }
.report-kpis { display: grid; grid-template-columns: repeat(4,1fr); gap: 13px; margin-bottom: 16px; }
.report-kpis article { padding: 18px; background: #fff; border: 1px solid #e3e8eb; border-radius: 13px; }
.report-kpis span,.report-kpis strong,.report-kpis small { display: block; }
.report-kpis span { color: #849199; font-size: 9px; }.report-kpis strong { margin: 9px 0 5px; font-size: 23px; }.report-kpis small { color: #9ba4aa; font-size: 8px; }
.reports-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.reports-grid.lower { grid-template-columns: 1.25fr .75fr; }
.report-card { min-height: 390px; }
.funnel-visual { display: flex; flex-direction: column; align-items: center; gap: 7px; padding: 9px 28px 25px; }
.funnel-step { height: 47px; display: flex; align-items: center; justify-content: space-between; padding: 0 19px; color: #fff; clip-path: polygon(7% 0,93% 0,100% 100%,0 100%); }
.funnel-step span { font-size: 10px; }.funnel-step strong { font-size: 15px; }
.funnel-lead { background: #7f96a5; }.funnel-following { background: #5879d2; }.funnel-won { background: #2b9b74; }.funnel-paused { background: #d49a43; }.funnel-lost { background: #b77a82; }
.source-chart { padding: 5px 25px 24px; }
.source-chart > div { display: grid; grid-template-columns: 85px 1fr 25px 100px; align-items: center; gap: 9px; margin: 17px 0; }
.source-chart span { color: #61717c; font-size: 9px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.source-chart > div > div { height: 7px; overflow: hidden; background: #edf1f3; border-radius: 7px; }.source-chart i { display: block; height: 100%; background: linear-gradient(90deg,#496ed1,#6d92ef); border-radius: inherit; }
.source-chart b { font-size: 10px; }.source-chart em { color: #929ca2; font-size: 8px; font-style: normal; text-align: right; }
.repeat-list { padding: 0 18px 18px; }.repeat-list a { display: flex; align-items: center; gap: 10px; padding: 10px 5px; border-top: 1px solid #edf0f2; }.repeat-list a > span:nth-child(2) { flex: 1; }.repeat-list strong,.repeat-list small { display: block; }.repeat-list strong { font-size: 10px; }.repeat-list small { margin-top: 4px; color: #909ba2; font-size: 8px; }.repeat-list em { color: #72808a; font-size: 8px; font-style: normal; }
.settings-card { max-width: 900px; padding: 23px; }.setting-row { display: flex; align-items: center; gap: 15px; }.setting-icon { width: 45px; height: 45px; display: grid; place-items: center; flex: none; color: #4d70c9; background: #edf2ff; border-radius: 12px; }.setting-row > div { flex: 1; }.setting-row h2 { margin-bottom: 6px; font-size: 14px; }.setting-row p { margin: 0; color: #7f8c94; font-size: 9px; line-height: 1.6; }.setting-row label { display: flex; align-items: center; gap: 7px; white-space: nowrap; }.setting-row label input { width: 80px; }.setting-row label span { margin: 0; }.setting-note { display: flex; align-items: center; gap: 8px; margin: 20px 0 5px; padding: 12px; color: #7b6a46; background: #fff8e9; border-radius: 9px; font-size: 9px; }.setting-note svg { width: 15px; flex: none; }
.open-project-space { min-height: 40px; display: flex; align-items: center; gap: 8px; margin-top: 14px; padding: 0 11px; color: #4565b3; background: #eef3ff; border: 1px solid #e0e8fb; border-radius: 9px; font-size: 10px; font-weight: 600; }
.open-project-space > span { flex: 1; color: #8492ad; font-size: 8px; font-weight: 400; }
.open-project-space svg { width: 14px; }
.project-space-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 25px; margin-bottom: 20px; }
.project-space-heading .back-link { margin-bottom: 14px; }
.project-space-title { display: flex; align-items: center; gap: 14px; }
.project-space-logo { width: 52px; height: 52px; display: grid; place-items: center; flex: none; color: #fff; background: linear-gradient(145deg,#315877,#1c3d53); border-radius: 15px; box-shadow: 0 8px 18px rgba(20,52,72,.18); }
.project-space-logo svg { width: 23px; }
.project-space-title h1 { margin: 5px 0; font-size: 26px; }
.project-space-title p { margin: 0; color: #74818a; font-size: 10px; }
.project-space-title p a { color: #4167c8; }
.project-space-status { min-width: 100px; padding: 12px 16px; text-align: right; background: #fff; border: 1px solid #e1e6e9; border-radius: 12px; }
.project-space-status .project-status { float: left; margin: 4px 12px 0 0; }
.project-space-status strong,.project-space-status small { display: block; }
.project-space-status strong { font-size: 20px; }.project-space-status small { margin-top: 2px; color: #8d989f; font-size: 8px; }
.project-space-tabs { display: flex; gap: 6px; margin-bottom: 17px; padding: 7px; background: #fff; border: 1px solid #e2e7ea; border-radius: 13px; }
.project-space-tabs a { min-height: 40px; display: flex; align-items: center; gap: 8px; padding: 0 16px; color: #6f7e88; border-radius: 9px; font-size: 11px; }
.project-space-tabs a.active { color: #315ec5; background: #edf2ff; font-weight: 600; }
.project-space-tabs svg { width: 16px; }.project-space-tabs em { min-width: 19px; height: 19px; display: grid; place-items: center; color: #70809a; background: #e7ebf2; border-radius: 10px; font-size: 8px; font-style: normal; }
.project-overview-grid { display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: 17px; }
.project-overview-grid > .card { padding-bottom: 20px; }
.project-overview-grid > aside { display: grid; align-content: start; gap: 13px; }
.overview-progress { margin: 5px 24px 20px; }
.overview-progress > span { display: flex; justify-content: space-between; color: #64737d; font-size: 10px; }
.overview-progress > div { height: 9px; margin-top: 9px; overflow: hidden; background: #e9edef; border-radius: 9px; }
.overview-progress i { display: block; height: 100%; background: linear-gradient(90deg,#4268d2,#4ca8c8); border-radius: inherit; }
.space-stat-card { min-height: 104px; display: flex; align-items: center; gap: 13px; padding: 18px; background: #fff; border: 1px solid #e1e6e9; border-radius: 13px; }
.space-stat-card > span { width: 39px; height: 39px; display: grid; place-items: center; flex: none; color: #4b6dc2; background: #eaf0ff; border-radius: 10px; }.space-stat-card.notes > span { color: #8c662e; background: #fff2dc; }
.space-stat-card > span svg { width: 18px; }.space-stat-card > div { flex: 1; }.space-stat-card strong,.space-stat-card p,.space-stat-card small { display: block; }.space-stat-card strong { font-size: 20px; }.space-stat-card p { margin: 2px 0; color: #455660; font-size: 10px; }.space-stat-card small { color: #929ca2; font-size: 8px; }.space-stat-card > svg { width: 15px; color: #a4adb3; }
.space-tip { display: flex; align-items: flex-start; gap: 10px; padding: 15px; color: #6d7e89; background: #eff5f7; border: 1px solid #dfeaec; border-radius: 11px; }.space-tip > svg { width: 17px; flex: none; color: #4c7880; }.space-tip p { margin: 0; font-size: 9px; line-height: 1.6; }.space-tip strong { display: block; margin-bottom: 3px; color: #46616a; }
.workspace-layout { display: grid; grid-template-columns: 220px minmax(0,1fr); gap: 16px; align-items: start; }
.workspace-folders { padding: 13px 8px; }
.workspace-side-title { padding: 9px 11px 13px; }.workspace-side-title strong,.workspace-side-title small { display: block; }.workspace-side-title strong { font-size: 12px; }.workspace-side-title small { margin-top: 5px; color: #8f9aa1; font-size: 8px; }
.workspace-folders > a { min-height: 39px; display: flex; align-items: center; gap: 9px; padding: 0 10px; color: #71808a; border-radius: 8px; font-size: 10px; }.workspace-folders > a:hover { background: #f4f7f8; }.workspace-folders > a.active { color: #315ebf; background: #edf2ff; font-weight: 600; }.workspace-folders > a svg { width: 15px; }.workspace-folders > a span { flex: 1; }.workspace-folders > a em { color: #929da4; font-size: 8px; font-style: normal; }
.workspace-main { overflow: hidden; }
.workspace-toolbar { min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 15px; border-bottom: 1px solid #e9edef; }
.workspace-toolbar form { display: flex; align-items: center; gap: 7px; }.workspace-toolbar .filter-search { width: 280px; height: 36px; }.workspace-toolbar .filter-search input { height: 34px; }
.project-empty { min-height: 350px; }
.project-file-list { min-width: 760px; }
.project-file-head,.project-file-list article { display: grid; grid-template-columns: minmax(245px,1.7fr) minmax(130px,.8fr) 75px minmax(130px,1fr) 75px; align-items: center; gap: 12px; padding: 0 15px; }
.project-file-head { min-height: 41px; color: #8a969e; background: #fafbfc; border-bottom: 1px solid #e9edef; font-size: 8px; }
.project-file-list article { min-height: 67px; border-bottom: 1px solid #edf0f2; }
.project-file-list article:last-child { border-bottom: 0; }.project-file-list article:hover { background: #fbfcfd; }
.project-file-list article > div:nth-child(2) { min-width: 0; }.project-file-list article > div:nth-child(2) strong,.project-file-list article > div:nth-child(2) small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }.project-file-list article > div:nth-child(2) strong { color: #344650; font-size: 10px; }.project-file-list article > div:nth-child(2) small { margin-top: 5px; color: #929ca2; font-size: 8px; }
.project-file-list .file-icon { width: 37px; height: 39px; position: absolute; margin-left: 0; }.project-file-list article > .file-icon + div { padding-left: 49px; }.file-icon em { position: absolute; right: -4px; bottom: -3px; padding: 2px 3px; color: #516679; background: #fff; border: 1px solid #dfe5e8; border-radius: 3px; font-size: 5px; font-style: normal; font-weight: 700; }
.project-file-list article > div:nth-child(3) small { display: block; margin-top: 4px; color: #929ca2; font-size: 8px; }.folder-chip { display: inline-flex; padding: 4px 6px; color: #526b8c; background: #edf2f8; border-radius: 5px; font-size: 8px; }.project-file-list article > span:nth-child(4) { color: #697983; font-size: 9px; }.project-file-list article > span:nth-child(5) b,.project-file-list article > span:nth-child(5) small { display: block; }.project-file-list article > span:nth-child(5) b { color: #596973; font-size: 9px; }.project-file-list article > span:nth-child(5) small { margin-top: 4px; color: #929ca2; font-size: 7px; }
.project-upload-panel { margin-top: 16px; padding: 0 22px 22px; }.project-upload-panel .card-header { padding-left: 0; padding-right: 0; }.project-upload-grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(280px,.8fr); gap: 18px; }.project-upload-grid > div { display: grid; gap: 11px; }
.notes-layout { display: grid; grid-template-columns: minmax(0,1fr) 360px; gap: 16px; align-items: start; }.notes-main { overflow: hidden; }.project-note-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; padding: 0 20px 20px; }.project-note-grid article { min-width: 0; padding: 16px; background: #fbfcfd; border: 1px solid #e5eaed; border-top: 3px solid #7792d8; border-radius: 11px; }.project-note-grid article.note-type-requirement { border-top-color: #d49a43; }.project-note-grid article.note-type-tech { border-top-color: #4d89a6; }.project-note-grid article.note-type-deploy { border-top-color: #6c7680; }.project-note-grid article.note-type-code { border-top-color: #374b5c; background: #f8fafb; }.project-note-grid article.note-type-meeting { border-top-color: #7c6aa4; }
.note-card-head { display: flex; align-items: center; gap: 9px; }.note-card-head > span { width: 31px; height: 31px; display: grid; place-items: center; flex: none; color: #5271be; background: #edf2ff; border-radius: 8px; }.note-card-head svg { width: 15px; }.note-card-head small { color: #8e999f; font-size: 7px; }.note-card-head h3 { margin: 4px 0 0; color: #354751; font-size: 11px; }.note-content,.project-note-grid pre { max-height: 185px; margin: 14px 0; overflow: auto; color: #65747e; font-size: 9px; line-height: 1.75; white-space: pre-wrap; word-break: break-word; }.project-note-grid pre { padding: 11px; color: #c8d6df; background: #182d3b; border-radius: 8px; font-family: Consolas, monospace; }.project-note-grid footer { display: flex; align-items: center; justify-content: space-between; padding-top: 10px; border-top: 1px solid #e8ecee; }.project-note-grid footer > span { color: #949da3; font-size: 7px; }.project-note-grid footer > div { display: flex; }.project-note-grid footer form { display: flex; }
.note-editor { padding: 0 20px 20px; }.note-editor .card-header { padding-left: 0; padding-right: 0; }.note-editor-body { display: grid; gap: 12px; }.note-editor textarea { font-family: Consolas,"Microsoft YaHei",sans-serif; font-size: 10px; }.note-editor-tip { display: flex; align-items: center; gap: 6px; padding: 9px; color: #846f45; background: #fff7e7; border-radius: 7px; font-size: 8px; }.note-editor-tip svg { width: 13px; flex: none; }
.form-step { width: 30px; height: 30px; display: grid; place-items: center; flex: none; color: #4b6cc2; background: #edf2ff; border-radius: 9px; font-size: 9px; font-weight: 700; }
.project-form-layout,.contract-create-layout { display: grid; grid-template-columns: minmax(0,1fr) 350px; gap: 17px; align-items: start; }
.project-form-main { display: grid; min-width: 0; gap: 15px; }
.project-websites-setup { overflow: hidden; }
.project-website-rows { display: grid; gap: 9px; }
.project-website-row { display: grid; grid-template-columns: 1fr 1.1fr 155px 34px; align-items: end; gap: 9px; padding: 11px; background: #f7f9fa; border: 1px solid #e7ecee; border-radius: 10px; }
.project-website-row .icon-btn { margin-bottom: 1px; }
.add-website-row { margin-top: 11px; }
.project-create-actions { max-width: 720px; flex-wrap: wrap; justify-content: flex-end; }
.project-filter-form { flex-wrap: wrap; }
.project-filter-form > input { min-width: 155px; padding: 0 12px; }
.project-filter-form .filter-search { flex: 1 1 210px; }
.project-domain-table { min-width: 1120px; }
.project-bulk-toolbar { display: flex; align-items: center; gap: 13px; margin-bottom: 12px; padding: 10px 14px; border-color: #e5d4d7; background: linear-gradient(90deg,#fff,#fff8f8); }
.project-bulk-toolbar label { display: inline-flex; align-items: center; gap: 8px; color: #52646e; font-size: 9px; font-weight: 700; cursor: pointer; }
.project-bulk-toolbar input,.project-select-column input { width: 16px; height: 16px; margin: 0; accent-color: #c5525d; cursor: pointer; }
.project-bulk-toolbar > span { color: #8a969c; font-size: 9px; }
.project-bulk-toolbar .btn { margin-left: auto; }
.project-bulk-toolbar .btn:disabled { opacity: .38; cursor: not-allowed; }
.project-domain-table .project-select-column { width: 44px; min-width: 44px; padding-left: 16px; padding-right: 4px; text-align: center; }
.project-domain-table tbody tr { transition: background-color .18s ease; }
.project-domain-table tbody tr.is-selected { background: #fff5f5; }
.project-domain-list { display: grid; gap: 4px; min-width: 150px; }
.project-domain-list span { display: block; max-width: 210px; overflow: hidden; color: #405d70; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.project-expiry { display: grid; gap: 3px; white-space: nowrap; }
.project-expiry strong { color: #53656f; font-size: 9px; }
.project-expiry small { color: #87949b; font-size: 8px; }
.project-expiry.soon { padding: 6px 8px; background: #fff3df; border-radius: 7px; }
.project-expiry.soon strong { color: #936521; }
.project-expiry.expired { padding: 6px 8px; background: #fae9eb; border-radius: 7px; }
.project-expiry.expired strong { color: #a14f57; }
.cell-empty { color: #9aa4aa; font-size: 8px; white-space: nowrap; }
.project-linked-assets .section-actions { flex-wrap: wrap; justify-content: flex-end; }
.quick-project-asset-form { margin-top: 16px; overflow: hidden; }
.quick-project-asset-form > .card-header { padding-bottom: 14px; border-bottom: 1px solid #e9edef; }
.quick-project-asset-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; padding: 18px 20px 4px; }
.quick-project-asset-grid .quick-asset-details { grid-column: span 3; }
.quick-project-asset-form .form-actions { padding: 12px 20px 20px; }
.project-form-card,.contract-create-main { padding: 0 24px 24px; }.project-form-card .card-header,.contract-create-main .card-header { padding-left: 0; padding-right: 0; }
.project-form-side,.contract-create-side { display: grid; gap: 14px; }.project-side-fields { display: grid; gap: 13px; }
.project-create-tip,.contract-create-tip { display: flex; align-items: flex-start; gap: 10px; padding: 15px; color: #536f78; background: #eef6f7; border: 1px solid #dcebec; border-radius: 11px; }.project-create-tip > svg,.contract-create-tip > svg { width: 18px; flex: none; color: #467d83; }.project-create-tip strong { display: block; margin-bottom: 4px; font-size: 10px; }.project-create-tip p,.contract-create-tip p { margin: 0; font-size: 9px; line-height: 1.7; }
.project-form-actions { display: flex; justify-content: flex-end; gap: 8px; }.project-heading-actions { display: flex; align-items: center; gap: 10px; }
.contract-create-main { padding-bottom: 28px; }.contract-flow-card { padding: 0 20px 19px; }.contract-flow-card .card-header { padding-left: 0; padding-right: 0; }.contract-flow-card ol { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }.contract-flow-card li { display: flex; align-items: flex-start; gap: 10px; padding: 11px; background: #f8fafb; border-radius: 9px; }.contract-flow-card li > span { width: 24px; height: 24px; display: grid; place-items: center; flex: none; color: #fff; background: #496bca; border-radius: 7px; font-size: 8px; }.contract-flow-card strong { display: block; color: #43545f; font-size: 10px; }.contract-flow-card p { margin: 4px 0 0; color: #8a959c; font-size: 8px; line-height: 1.55; }
.contract-record { display: grid!important; grid-template-columns: minmax(260px,1.5fr) 120px minmax(170px,.8fr); }
.contract-sign-control { display: flex; align-items: center; justify-content: flex-end; gap: 7px; flex-wrap: wrap; }
.contract-sign-badge { display: inline-flex; align-items: center; padding: 5px 8px; border-radius: 7px; font-size: 9px; white-space: nowrap; }
.sign-draft,.sign-sent { color: #9c6b2c; background: #fff2dd; }.sign-signed { color: #207c59; background: #e5f5ee; }.sign-revoked { color: #a45159; background: #f8e9eb; }
.contract-link-actions { display: flex; }.contract-link-actions form { display: flex; }.btn.copied { color: #fff; background: var(--green); border-color: var(--green); }
.settings-layout { display: grid; gap: 15px; max-width: 900px; }.settings-layout .settings-card { max-width: none; }.backup-card { max-width: 900px; display: flex; align-items: center; gap: 15px; margin-top: 15px; padding: 20px 23px; }.backup-icon { width: 43px; height: 43px; display: grid; place-items: center; flex: none; color: #4c6fc1; background: #edf2ff; border-radius: 11px; }.backup-icon svg { width: 19px; }.backup-card > div { flex: 1; }.backup-card h2 { margin-bottom: 5px; font-size: 13px; }.backup-card p { margin: 0; color: #7e8a92; font-size: 9px; line-height: 1.6; }
.profile-layout { display: grid; grid-template-columns: 300px minmax(0,600px); gap: 17px; align-items: start; }.profile-card { padding: 27px; text-align: center; }.profile-avatar { width: 64px; height: 64px; margin-bottom: 11px; font-size: 22px; }.profile-card h2 { margin-bottom: 4px; }.profile-card > p { color: #8a959d; font-size: 10px; }.profile-card dl { margin: 23px 0 0; padding-top: 12px; border-top: 1px solid #e9edef; text-align: left; }.profile-card dl div { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; }.profile-card dt { color: #8b969d; font-size: 9px; }.profile-card dd { margin: 0; color: #4d5c66; font-size: 9px; }.password-card { padding: 0 24px 24px; }.password-card .card-header { padding-left: 0; padding-right: 0; }.password-card .card-header > svg { color: #5876c3; }.password-fields { display: grid; gap: 15px; }.password-fields .btn { justify-self: start; }
.project-workflow-card { margin-top: 16px; padding: 0 20px 20px; }.project-workflow-card .card-header { padding-left: 0; padding-right: 0; }.workflow-total { text-align: right; }.workflow-total strong,.workflow-total span { display: block; }.workflow-total strong { color: #3f65b8; font-size: 17px; }.workflow-total span { margin-top: 3px; color: #89969d; font-size: 7px; }.workflow-total-bar { height: 6px; margin: -3px 0 17px; overflow: hidden; background: #e9edf0; border-radius: 99px; }.workflow-total-bar i { height: 100%; display: block; background: linear-gradient(90deg,#4d70c3,#45a07c); border-radius: inherit; }.workflow-stage-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; }.workflow-stage { overflow: hidden; background: #fafbfc; border: 1px solid #e5eaed; border-radius: 10px; }.workflow-stage > header { display: flex; align-items: center; gap: 9px; padding: 12px 14px; background: #f3f6f8; border-bottom: 1px solid #e5eaed; }.workflow-stage > header > span { width: 30px; height: 30px; display: grid; place-items: center; flex: none; color: #4f70bb; background: #e8efff; border-radius: 8px; }.workflow-stage > header svg { width: 15px; }.workflow-stage header h3 { margin: 0 0 3px; color: #435761; font-size: 10px; }.workflow-stage header small { color: #8d999f; font-size: 7px; }.workflow-stage.complete > header { background: #eef8f4; }.workflow-stage.complete > header > span { color: #2f8b67; background: #dcf1e8; }.workflow-items form { border-top: 1px solid #edf0f2; }.workflow-items form:first-child { border-top: 0; }.workflow-items button { width: 100%; display: flex; align-items: flex-start; gap: 9px; padding: 11px 13px; color: inherit; background: transparent; border: 0; text-align: left; cursor: pointer; }.workflow-items button:hover:not(:disabled) { background: #f3f7ff; }.workflow-items button:disabled { cursor: default; }.workflow-items button > span { width: 18px; height: 18px; display: grid; place-items: center; flex: none; border: 1px solid #bdc8ce; border-radius: 5px; }.workflow-items button > span svg { width: 12px; }.workflow-items button > div { min-width: 0; }.workflow-items strong,.workflow-items small { display: block; }.workflow-items strong { color: #50616b; font-size: 8px; line-height: 1.5; }.workflow-items small { margin-top: 3px; color: #929ca2; font-size: 7px; line-height: 1.45; }.workflow-items form.done button > span { color: #fff; background: #3d9b72; border-color: #3d9b72; }.workflow-items form.done strong { color: #75837c; text-decoration: line-through; }
.project-linked-assets { margin-top: 16px; overflow: hidden; }.project-asset-strip { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-top: 1px solid #e9edef; }.project-asset-strip > a { min-width: 0; display: grid; grid-template-columns: 34px minmax(0,1fr) auto 15px; align-items: center; gap: 10px; padding: 14px 18px; color: inherit; border-bottom: 1px solid #edf0f2; }.project-asset-strip > a:nth-child(odd) { border-right: 1px solid #edf0f2; }.project-asset-strip > a:hover { background: #f8faff; }.project-asset-strip > a > span { width: 34px; height: 34px; display: grid; place-items: center; color: #4c70bd; background: #edf2ff; border-radius: 9px; }.project-asset-strip > a > span svg { width: 16px; }.project-asset-strip > a > div { min-width: 0; }.project-asset-strip small,.project-asset-strip strong,.project-asset-strip em { display: block; }.project-asset-strip > a > div small { color: #8f9aa1; font-size: 7px; }.project-asset-strip > a > div strong { margin: 4px 0; overflow: hidden; color: #435761; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.project-asset-strip em { overflow: hidden; color: #7f8d95; font-size: 7px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }.project-asset-strip > a > b { color: #576b76; font-size: 8px; font-weight: 600; text-align: right; }.project-asset-strip > a > b small { margin-top: 3px; color: #909ba2; font-size: 7px; font-weight: 400; }.project-asset-strip > a > svg { width: 14px; color: #9aa5ab; }
.contract-public-body { min-height: 100vh; color: #24333d; background: #edf1f3; }
.contract-public-header { height: 72px; display: flex; align-items: center; justify-content: space-between; padding: 0 max(24px,calc((100vw - 920px)/2)); color: #d9e5eb; background: #102d3e; }
.contract-public-header .brand { padding: 0; }.contract-public-header .brand strong { max-width: 440px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.contract-public-header > span { display: flex; align-items: center; gap: 7px; color: #86a0af; font-size: 9px; }.contract-public-header > span svg { width: 15px; }
.contract-document { width: min(920px,calc(100vw - 30px)); margin: 25px auto 45px; }.contract-document > .alert { margin-bottom: 15px; }
.contract-paper { padding: 43px 54px; background: #fff; border: 1px solid #dfe5e8; border-radius: 16px; box-shadow: 0 16px 50px rgba(21,45,59,.09); }
.contract-paper-top { display: flex; align-items: center; justify-content: space-between; }.contract-no { color: #7b8891; font-size: 9px; letter-spacing: .4px; }.contract-paper > h1 { margin: 30px 0 8px; font-family: "SimSun","Microsoft YaHei",serif; font-size: 28px; text-align: center; }.contract-project-line { color: #87939a; font-size: 10px; text-align: center; }
.contract-parties { display: grid; grid-template-columns: 1fr 35px 1fr; align-items: center; gap: 13px; margin: 35px 0 20px; }.contract-parties > i { color: #9ca8af; font-style: normal; }.contract-parties > i svg { width: 17px; }.contract-parties article { min-height: 142px; padding: 17px; background: #f7f9fa; border: 1px solid #e6eaed; border-radius: 11px; }.contract-parties article > span { color: #859198; font-size: 8px; }.contract-parties article > strong { display: block; margin: 7px 0 13px; color: #30434f; font-size: 12px; }.contract-parties dl { margin: 0; }.contract-parties dl div { display: grid; grid-template-columns: 60px 1fr; gap: 7px; margin: 6px 0; }.contract-parties dt { color: #96a0a6; font-size: 8px; }.contract-parties dd { margin: 0; color: #65737d; font-size: 8px; word-break: break-all; }
.contract-key-info { display: grid; grid-template-columns: repeat(3,1fr); margin-bottom: 30px; overflow: hidden; background: #e4e8eb; border: 1px solid #e2e7ea; border-radius: 10px; gap: 1px; }.contract-key-info > div { padding: 14px; background: #f8fafb; text-align: center; }.contract-key-info span,.contract-key-info strong { display: block; }.contract-key-info span { color: #8b969d; font-size: 8px; }.contract-key-info strong { margin-top: 6px; color: #344752; font-size: 11px; }
.contract-terms h2,.contract-payment-table h2 { padding-bottom: 10px; font-size: 13px; border-bottom: 1px solid #dfe5e8; }.contract-terms > div { color: #4d5d67; font-family: "SimSun","Microsoft YaHei",serif; font-size: 11px; line-height: 2.05; }.contract-payment-table { margin-top: 30px; }.contract-payment-table table { border: 1px solid #dfe4e7; }.contract-payment-table th,.contract-payment-table td { padding: 10px 12px; }
.contract-sign-form { margin-top: 38px; padding-top: 32px; border-top: 2px solid #273e4d; }.sign-form-title { display: flex; align-items: center; gap: 11px; margin-bottom: 20px; }.sign-form-title > span { width: 38px; height: 38px; display: grid; place-items: center; color: #fff; background: #244b62; border-radius: 10px; font-size: 10px; }.sign-form-title h2 { margin: 0 0 4px; font-size: 16px; }.sign-form-title p { margin: 0; color: #8a959c; font-size: 9px; }.signer-fields { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 13px; }.signature-label { margin-top: 20px; }.signature-board { height: 190px; position: relative; overflow: hidden; background: #fbfcfd; border: 1px dashed #aebcc4; border-radius: 11px; touch-action: none; }.signature-board canvas { position: absolute; inset: 0; z-index: 2; cursor: crosshair; touch-action: none; }.signature-board > span { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 8px; color: #a1abb1; font-size: 10px; pointer-events: none; }.signature-board > span svg { width: 16px; }.signature-board > button { position: absolute; right: 9px; top: 9px; z-index: 4; padding: 5px 8px; color: #667782; background: #fff; border: 1px solid #dfe5e8; border-radius: 6px; font-size: 8px; }.contract-consent { display: flex; align-items: flex-start; gap: 9px; margin: 17px 0; padding: 12px; background: #f5f8fa; border-radius: 8px; }.contract-consent input { width: 16px; height: 16px; flex: none; margin: 0; }.contract-consent span { margin: 0; color: #677680; font-size: 9px; font-weight: 400; line-height: 1.6; }.sign-security-tip { margin: 10px 0 0; color: #99a2a8; font-size: 8px; text-align: center; }
.signed-receipt { margin-top: 38px; padding: 23px; background: #f3faf7; border: 1px solid #d5ebe2; border-radius: 12px; }.signed-receipt-title { display: flex; align-items: center; gap: 10px; }.signed-receipt-title > svg { width: 30px; height: 30px; color: #26906a; }.signed-receipt-title h2 { margin: 0 0 4px; color: #276950; font-size: 15px; }.signed-receipt-title p { margin: 0; color: #779287; font-size: 8px; }.signed-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; margin: 20px 0; }.signed-grid > div { padding: 11px; background: rgba(255,255,255,.7); border-radius: 8px; }.signed-grid span,.signed-grid strong { display: block; }.signed-grid span { color: #82958d; font-size: 8px; }.signed-grid strong { margin-top: 5px; color: #425d52; font-size: 10px; }.signed-signature { display: flex; align-items: center; gap: 20px; padding: 14px; background: #fff; border-radius: 9px; }.signed-signature > span { color: #7b8c85; font-size: 9px; }.signed-signature img { max-width: 240px; max-height: 100px; object-fit: contain; }.hash-line { margin: 14px 0; }.hash-line span { display: block; margin-bottom: 5px; color: #81918a; font-size: 8px; }.hash-line code { display: block; padding: 8px; overflow-wrap: anywhere; color: #496157; background: #e7f2ed; border-radius: 6px; font-size: 7px; }.contract-revoked { display: flex; align-items: center; gap: 12px; margin-top: 35px; padding: 20px; color: #9e4d54; background: #fbecee; border-radius: 10px; }.contract-revoked svg { width: 25px; }.contract-revoked h2 { margin: 0 0 5px; font-size: 14px; }.contract-revoked p { margin: 0; font-size: 9px; }.contract-public-footer { padding: 20px; color: #8a979e; font-size: 8px; text-align: center; }.simple-message { width: min(480px,calc(100vw - 30px)); margin: 14vh auto; padding: 50px 35px; background: #fff; border-radius: 16px; text-align: center; box-shadow: var(--shadow); }.simple-message > span { width: 50px; height: 50px; display: inline-grid; place-items: center; color: #9b5b60; background: #f9eaec; border-radius: 50%; }.simple-message h1 { margin-top: 20px; }.simple-message p { color: #7c8991; font-size: 10px; line-height: 1.7; }

/* Company drive */
.drive-security-tip { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 14px; padding: 16px 19px; color: #48656e; background: #eef6f7; border-color: #d9e9eb; }.drive-security-tip > svg { width: 20px; flex: none; color: #3c7d84; }.drive-security-tip strong { display: block; margin-bottom: 4px; font-size: 10px; }.drive-security-tip p { margin: 0; color: #71858d; font-size: 9px; line-height: 1.65; }
.drive-toolbar { display: flex; align-items: center; gap: 9px; margin-bottom: 13px; padding: 13px 15px; }.drive-toolbar .filter-search { flex: 1; width: auto; }.drive-toolbar select { width: 180px; }
.drive-folder-strip { display: flex; gap: 9px; margin-bottom: 18px; overflow-x: auto; padding-bottom: 3px; }.drive-folder-mini { min-width: 135px; display: flex; align-items: center; gap: 8px; padding: 11px 12px; color: #6d7e89; background: #fff; border: 1px solid #e0e6e9; border-radius: 10px; }.drive-folder-mini:hover,.drive-folder-mini.active { color: #315fbd; background: #f0f4ff; border-color: #cad6f3; }.drive-folder-mini svg { width: 16px; }.drive-folder-mini span { flex: 1; font-size: 9px; white-space: nowrap; }.drive-folder-mini em { color: #929da4; font-size: 8px; font-style: normal; }
.drive-section { margin: 23px 0; }.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 15px; margin-bottom: 12px; }.section-heading h2 { margin: 3px 0 0; font-size: 17px; }.section-heading p { margin: 5px 0 0; color: #87939a; font-size: 9px; }.section-heading > span { color: #8b969d; font-size: 9px; }
.drive-note-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }.drive-note-card { min-width: 0; padding: 16px; }.drive-note-top { display: flex; align-items: center; gap: 9px; padding-bottom: 13px; border-bottom: 1px solid #e9edef; }.drive-note-top > span { width: 35px; height: 35px; display: grid; place-items: center; flex: none; color: #4e71c5; background: #edf2ff; border-radius: 9px; }.drive-note-top > span svg { width: 16px; }.drive-note-top > div { min-width: 0; flex: 1; }.drive-note-top small { color: #89959d; font-size: 7px; }.drive-note-top h3 { margin: 3px 0 0; overflow: hidden; color: #374a55; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.drive-note-top > em { padding: 4px 6px; color: #697b86; background: #f2f5f6; border-radius: 5px; font-size: 7px; font-style: normal; white-space: nowrap; }.drive-note-row { display: grid; grid-template-columns: 68px minmax(0,1fr); gap: 8px; margin-top: 11px; font-size: 8px; }.drive-note-row span { color: #929ca2; }.drive-note-row strong,.drive-note-row a { overflow-wrap: anywhere; color: #4d6372; }.drive-note-row a { color: #3c68c8; }.drive-note-details { max-height: 120px; margin: 13px 0; overflow: auto; color: #71808a; font-size: 8px; line-height: 1.7; }.drive-note-card footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 13px; padding-top: 10px; border-top: 1px solid #e9edef; }.drive-note-card footer > span { color: #929ca2; font-size: 7px; }.drive-note-card footer > div,.drive-note-card footer form { display: flex; }
.drive-expiry-row { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 12px; }.drive-expiry-row > span { position: relative; display: grid; grid-template-columns: 18px 1fr; padding: 9px; color: #61737e; background: #f5f7f8; border-radius: 8px; }.drive-expiry-row svg { width: 14px; grid-row: 1 / 4; align-self: center; }.drive-expiry-row small,.drive-expiry-row strong,.drive-expiry-row em { display: block; }.drive-expiry-row small { color: #8c989f; font-size: 7px; }.drive-expiry-row strong { margin-top: 2px; font-size: 9px; }.drive-expiry-row em { margin-top: 2px; color: #8b969d; font-size: 7px; font-style: normal; }.drive-expiry-row > span.soon { color: #946522; background: #fff4df; }.drive-expiry-row > span.expired { color: #a34f58; background: #fae9eb; }
.drive-files-card { overflow: hidden; }.drive-file-list { min-width: 930px; }.drive-file-list article { display: grid; grid-template-columns: minmax(260px,1.5fr) 95px 70px 130px 145px 75px; align-items: center; gap: 12px; min-height: 68px; padding: 0 17px; border-top: 1px solid #edf0f2; }.drive-file-list article:hover { background: #fbfcfd; }.drive-file-list .file-icon { position: absolute; width: 38px; height: 40px; }.drive-file-list .file-icon + div { min-width: 0; padding-left: 50px; }.drive-file-list .file-icon + div strong,.drive-file-list .file-icon + div small,.drive-file-list article > span:nth-child(5) b,.drive-file-list article > span:nth-child(5) small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.drive-file-list .file-icon + div strong { color: #3b4d57; font-size: 10px; }.drive-file-list .file-icon + div small,.drive-file-list article > span:nth-child(5) small { margin-top: 4px; color: #929ca2; font-size: 7px; }.drive-file-list article > span:nth-child(4),.drive-file-list article > span:nth-child(5) { color: #657680; font-size: 8px; }.drive-visibility { display: flex; align-items: center; gap: 5px; color: #75858e; font-size: 7px; }.drive-visibility svg { width: 13px; flex: none; }
.customer-drive-section { margin-top: 28px; }.customer-folder-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }.customer-folder-card { min-width: 0; display: grid; grid-template-columns: 46px minmax(0,1fr); gap: 12px; padding: 16px; color: inherit; }.customer-folder-card:hover { border-color: #cad6ee; box-shadow: 0 8px 25px rgba(35,61,77,.07); }.customer-folder-icon { width: 46px; height: 46px; display: grid; place-items: center; color: #5275c7; background: #edf2ff; border-radius: 11px; }.customer-folder-icon svg { width: 22px; }.customer-folder-card small { color: #8d989f; font-size: 7px; }.customer-folder-card h3 { margin: 5px 0; overflow: hidden; color: #3c4e59; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.customer-folder-card p { margin: 0; color: #849198; font-size: 8px; }.customer-folder-card footer { grid-column: 1 / -1; display: flex; align-items: center; gap: 14px; padding-top: 10px; border-top: 1px solid #e9edef; color: #7f8c94; font-size: 8px; }.customer-folder-card footer svg { width: 14px; margin-left: auto; }
.drive-panel { margin-top: 16px; padding: 0 22px 22px; }.drive-panel .card-header { padding-left: 0; padding-right: 0; }.drive-form-grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(280px,.8fr); gap: 18px; }.drive-form-grid > div { display: grid; gap: 11px; }.infrastructure-reminders { grid-column: 1 / -1; }
.form-inline-tip { display: flex; align-items: center; gap: 6px; margin: -3px 0 0; padding: 8px 10px; color: #7b6948; background: #fff6e7; border-radius: 7px; font-size: 8px; }.form-inline-tip svg { width: 13px; flex: none; }
.customer-archive-summary { margin-bottom: 14px; overflow: hidden; }.customer-archive-main { display: flex; align-items: center; gap: 13px; padding: 18px 20px; border-bottom: 1px solid #e9edef; }.customer-archive-avatar { width: 47px; height: 47px; display: grid; place-items: center; flex: none; color: #fff; background: linear-gradient(145deg,#4e70c3,#3155ac); border-radius: 12px; font-size: 16px; font-weight: 700; }.customer-archive-main > div { min-width: 0; flex: 1; }.customer-archive-main small { color: #8b969d; font-size: 8px; }.customer-archive-main h2 { margin: 4px 0; color: #344853; font-size: 16px; }.customer-archive-main p { margin: 0; color: #7f8e96; font-size: 9px; }.customer-archive-details { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; background: #e9edef; }.customer-archive-details > div { min-width: 0; padding: 12px 18px; background: #fbfcfd; }.customer-archive-details span,.customer-archive-details strong { display: block; }.customer-archive-details span { margin-bottom: 5px; color: #909ba2; font-size: 7px; }.customer-archive-details strong { overflow: hidden; color: #53646e; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.customer-contact-strip { display: flex; gap: 9px; padding: 13px 18px; overflow-x: auto; border-top: 1px solid #e9edef; }.customer-contact-strip article { min-width: 210px; display: flex; align-items: center; gap: 8px; padding: 9px 11px; background: #f5f7f8; border-radius: 8px; }.customer-contact-strip .avatar { width: 29px; height: 29px; flex: none; font-size: 9px; }.customer-contact-strip strong,.customer-contact-strip small { display: block; }.customer-contact-strip strong { color: #4d5f69; font-size: 9px; }.customer-contact-strip small { max-width: 180px; margin-top: 3px; overflow: hidden; color: #8b969d; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.drive-project-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }.drive-project-card { min-width: 0; overflow: hidden; }.drive-project-card-main { display: flex; align-items: center; gap: 12px; padding: 16px; color: inherit; }.drive-project-folder-icon { width: 43px; height: 43px; display: grid; place-items: center; flex: none; color: #4d71c2; background: #edf2ff; border-radius: 11px; }.drive-project-folder-icon svg { width: 21px; }.drive-project-card-main > div { min-width: 0; }.drive-project-card-main small { color: #89959c; font-size: 7px; }.drive-project-card-main h3 { margin: 5px 0; overflow: hidden; color: #3c4f5a; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.drive-project-card-main p { margin: 0; color: #829097; font-size: 8px; }.drive-project-progress { display: flex; align-items: center; gap: 8px; padding: 0 16px 12px; }.drive-project-progress > span { height: 5px; flex: 1; overflow: hidden; background: #e9edf0; border-radius: 99px; }.drive-project-progress i { height: 100%; display: block; background: linear-gradient(90deg,#4e71c4,#4fa1a2); border-radius: inherit; }.drive-project-progress em { color: #71808a; font-size: 7px; font-style: normal; }.drive-project-card footer { display: flex; align-items: center; gap: 12px; padding: 11px 16px; color: #7f8e96; background: #f8fafb; border-top: 1px solid #e9edef; font-size: 7px; }.drive-project-card footer > div { display: flex; gap: 9px; margin-left: auto; }.drive-project-card footer a { color: #4168bd; }
.section-actions { display: flex; align-items: center; gap: 10px; }.section-actions > span { color: #8b969d; font-size: 9px; }.customer-asset-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; }.customer-asset-card { min-width: 0; padding: 17px; border-top: 3px solid #5978c4; }.customer-asset-card.asset-type-server { border-top-color: #527986; }.customer-asset-card.asset-type-program,.customer-asset-card.asset-type-database { border-top-color: #546a78; }.customer-asset-card.asset-type-wechat,.customer-asset-card.asset-type-mini_program { border-top-color: #3c9a72; }.customer-asset-card > header { display: flex; align-items: center; gap: 10px; padding-bottom: 13px; border-bottom: 1px solid #e9edef; }.customer-asset-card > header > span { width: 37px; height: 37px; display: grid; place-items: center; flex: none; color: #4d70c2; background: #edf2ff; border-radius: 9px; }.customer-asset-card > header > span svg { width: 17px; }.customer-asset-card > header > div { min-width: 0; flex: 1; }.customer-asset-card header small { color: #89959c; font-size: 7px; }.customer-asset-card header h3 { margin: 4px 0 0; overflow: hidden; color: #374b56; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.asset-status { padding: 4px 7px; color: #267456; background: #e5f5ee; border-radius: 6px; font-size: 7px; font-style: normal; white-space: nowrap; }.asset-status.status-testing { color: #8b6729; background: #fff1d9; }.asset-status.status-paused,.asset-status.status-disabled,.asset-status.status-expired { color: #9a5158; background: #f8e8ea; }.asset-project-link { display: flex; align-items: center; gap: 6px; margin-top: 11px; padding: 8px 9px; color: #486bbd; background: #f0f4ff; border-radius: 7px; font-size: 8px; }.asset-project-link svg { width: 13px; }.asset-detail-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; margin: 10px 0 0; }.asset-detail-list > div { min-width: 0; padding: 8px 0; border-bottom: 1px dashed #e6ebed; }.asset-detail-list dt { margin-bottom: 4px; color: #929da3; font-size: 7px; }.asset-detail-list dd { margin: 0; overflow-wrap: anywhere; color: #52646e; font-size: 8px; line-height: 1.5; }.asset-detail-list dd a { color: #3d68c5; }.asset-detail-list dd svg { width: 12px; margin-right: 4px; vertical-align: -2px; color: #4b7c82; }.asset-expiry-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; margin-top: 12px; }.asset-expiry-grid > span { padding: 9px; background: #f4f7f8; border-radius: 8px; }.asset-expiry-grid small,.asset-expiry-grid strong,.asset-expiry-grid em { display: block; }.asset-expiry-grid small { color: #8d989f; font-size: 7px; }.asset-expiry-grid strong { margin: 3px 0; color: #53656f; font-size: 9px; }.asset-expiry-grid em { color: #839199; font-size: 7px; font-style: normal; }.asset-expiry-grid .soon { background: #fff3df; }.asset-expiry-grid .expired { background: #fae9eb; }.asset-expiry-grid .soon strong { color: #936521; }.asset-expiry-grid .expired strong { color: #a14f57; }.asset-renewal { display: flex; align-items: center; gap: 7px; margin-top: 10px; padding: 8px 9px; color: #61777b; background: #edf6f3; border-radius: 7px; font-size: 8px; }.asset-renewal svg { width: 13px; }.asset-details { max-height: 120px; margin: 11px 0 0; overflow: auto; color: #718089; font-size: 8px; line-height: 1.7; }.customer-asset-card > footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 13px; padding-top: 10px; border-top: 1px solid #e9edef; }.customer-asset-card > footer > span { color: #929ca2; font-size: 7px; }.customer-asset-card > footer > div,.customer-asset-card > footer form { display: flex; }
.project-aggregate-card { margin-top: 15px; }.drive-project-file-list { min-width: 930px; }.drive-project-file-list article { display: grid; grid-template-columns: minmax(220px,1.3fr) minmax(160px,.8fr) 120px 110px 68px; align-items: center; gap: 12px; min-height: 72px; padding: 0 17px; border-top: 1px solid #edf0f2; }.drive-project-file-list article:hover { background: #fbfcfd; }.drive-project-file-list .file-icon { position: absolute; width: 38px; height: 40px; }.drive-project-file-list .file-icon + div { min-width: 0; padding-left: 50px; }.drive-project-file-list strong,.drive-project-file-list small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.drive-project-file-list strong { color: #3e515c; font-size: 9px; }.drive-project-file-list small { margin-top: 4px; color: #909ba2; font-size: 7px; }.project-file-owner { min-width: 0; }.project-file-owner strong { color: #4168bc; }.drive-project-file-list article > span:nth-child(5) { color: #667680; font-size: 8px; }
.drive-asset-form { max-width: 1100px; }.asset-form-sections { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }.asset-form-sections > section { padding: 16px; background: #f8fafb; border: 1px solid #e6ebed; border-radius: 11px; }.asset-form-sections h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; color: #41545f; font-size: 11px; }.asset-form-sections h3 > span { width: 25px; height: 25px; display: grid; place-items: center; color: #4b6fc0; background: #eaf0ff; border-radius: 7px; font-size: 7px; }.asset-form-sections .field-grid { gap: 11px; }

@media (max-width: 1180px) {
    .stat-grid { grid-template-columns: 1fr 1fr; }
    .activity-list { grid-template-columns: 1fr; }
    .detail-grid { grid-template-columns: minmax(0,1fr) 285px; }
    .info-grid { grid-template-columns: 1fr 1fr; }
    .money-summary { grid-template-columns: 1fr 1fr; }
    .report-kpis { grid-template-columns: 1fr 1fr; }
    .project-grid { grid-template-columns: 1fr; }
    .notes-layout { grid-template-columns: 1fr 310px; }
    .project-note-grid { grid-template-columns: 1fr; }
    .drive-note-grid,.customer-folder-grid { grid-template-columns: 1fr 1fr; }
    .customer-asset-grid { grid-template-columns: 1fr; }
    .contract-record { grid-template-columns: minmax(230px,1fr) 110px; }
    .contract-sign-control { grid-column: 1 / -1; justify-content: flex-start; }
}

@media (max-width: 900px) {
    :root { --sidebar: 236px; }
    .sidebar { transform: translateX(-100%); transition: .25s; }
    .sidebar.open { transform: translateX(0); box-shadow: 18px 0 45px rgba(12,31,43,.25); }
    .mobile-overlay { position: fixed; inset: 0; display: block; z-index: 25; background: rgba(10,26,37,.42); opacity: 0; visibility: hidden; transition: .25s; }
    .sidebar.open + .mobile-overlay { opacity: 1; visibility: visible; }
    .main-content { margin-left: 0; }
    .mobile-menu { display: grid; place-items: center; }
    .topbar { padding: 0 20px; }
    .top-search { width: min(430px, 58vw); }
    .content-wrap { padding: 27px 20px 50px; }
    .detail-grid { grid-template-columns: 1fr; }
    .detail-side { grid-template-columns: 1fr 1fr; }
    .danger-zone { grid-column: 1 / -1; }
    .login-shell { grid-template-columns: 1fr; }
    .login-brand { display: none; }
    .login-panel { min-height: 620px; }
    .mobile-brand { display: flex; align-items: center; gap: 10px; margin-bottom: 50px; color: #284152; font-weight: 700; }
    .tab-layout,.contract-layout { grid-template-columns: 1fr; }
    .contract-forms { grid-template-columns: 1fr 1fr; }
    .reports-grid,.reports-grid.lower { grid-template-columns: 1fr; }
    .import-body { grid-template-columns: 1fr; }
    .project-overview-grid { grid-template-columns: 1fr; }
    .project-overview-grid > aside { grid-template-columns: 1fr 1fr; }
    .project-asset-strip { grid-template-columns: 1fr; }.project-asset-strip > a:nth-child(odd) { border-right: 0; }
    .space-tip { grid-column: 1 / -1; }
    .workspace-layout { grid-template-columns: 190px minmax(0,1fr); }
    .notes-layout { grid-template-columns: 1fr; }
    .note-editor { order: -1; }
    .profile-layout { grid-template-columns: 260px minmax(0,1fr); }
    .project-form-layout,.contract-create-layout { grid-template-columns: 1fr; }
    .workflow-stage-grid { grid-template-columns: 1fr; }
    .drive-file-list { overflow-x: auto; }
    .drive-project-file-list { overflow-x: auto; }
    .asset-form-sections { grid-template-columns: 1fr; }
    .project-form-side,.contract-create-side { grid-template-columns: 1fr 1fr; }
    .project-form-actions { grid-column: 1 / -1; }
    .project-website-row { grid-template-columns: 1fr 1fr 150px 34px; }
    .quick-project-asset-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .quick-project-asset-grid .quick-asset-details { grid-column: span 2; }
}

@media (max-width: 680px) {
    .top-search { display: none; }
    .top-actions .btn { width: 40px; padding: 0; font-size: 0; }
    .page-heading { align-items: flex-start; }
    .page-heading h1 { font-size: 24px; }
    .page-heading p { max-width: 250px; line-height: 1.6; }
    .stat-grid, .dashboard-grid, .reminder-grid { grid-template-columns: 1fr; }
    .stat-card { min-height: 125px; }
    .filter-form { align-items: stretch; flex-direction: column; }
    .filter-form select, .filter-search { width: 100%; }
    .field-grid { grid-template-columns: 1fr; }
    .span-2 { grid-column: auto; }
    .detail-heading { align-items: flex-start; }
    .detail-title { align-items: flex-start; }
    .title-line { align-items: flex-start; flex-wrap: wrap; }
    .title-line h1 { flex-basis: 100%; font-size: 23px; }
    .detail-actions { width: 100%; }
    .detail-actions .btn, .detail-actions form { flex: 1; }
    .detail-actions form .btn { width: 100%; }
    .detail-side { grid-template-columns: 1fr; }
    .info-grid { grid-template-columns: 1fr; }
    .money-summary { grid-template-columns: 1fr; }
    .reminder-hero { align-items: flex-start; flex-direction: column; }
    .reminder-split { flex-wrap: wrap; gap: 10px 18px; }
    .login-shell { width: calc(100vw - 24px); min-height: calc(100vh - 24px); margin: 12px; }
    .login-panel { min-height: calc(100vh - 24px); padding: 35px 25px; }
    .customer-cell small { max-width: 120px; }
    .heading-actions { align-items: stretch; flex-direction: column; }
    .heading-actions .btn { width: 100%; }
    .project-create-actions { width: 100%; }
    .project-filter-form > input { width: 100%; }
    .project-website-row { grid-template-columns: 1fr; }
    .project-website-row .icon-btn { width: 100%; }
    .quick-project-asset-grid { grid-template-columns: 1fr; }
    .quick-project-asset-grid .quick-asset-details { grid-column: auto; }
    .project-linked-assets .card-header { align-items: flex-start; }
    .project-linked-assets .section-actions { width: 100%; justify-content: flex-start; }
    .contact-grid,.finance-summary,.report-kpis { grid-template-columns: 1fr; }
    .project-meta { grid-template-columns: 1fr 1fr; }
    .contract-forms { grid-template-columns: 1fr; }
    .ticket-list article { flex-wrap: wrap; }
    .ticket-meta { justify-items: start; }
    .source-chart > div { grid-template-columns: 70px 1fr 20px; }
    .source-chart em { display: none; }
    .setting-row { align-items: flex-start; flex-wrap: wrap; }
    .project-space-heading { align-items: flex-start; flex-direction: column; }
    .project-space-status { text-align: left; }
    .project-space-tabs { overflow-x: auto; }
    .project-overview-grid > aside { grid-template-columns: 1fr; }
    .space-tip { grid-column: auto; }
    .workspace-layout { grid-template-columns: 1fr; }
    .workspace-folders { display: flex; overflow-x: auto; }
    .workspace-side-title { min-width: 130px; }
    .workspace-folders > a { min-width: 120px; }
    .workspace-toolbar { align-items: stretch; flex-direction: column; }
    .workspace-toolbar form,.workspace-toolbar .filter-search { width: 100%; }
    .project-upload-grid { grid-template-columns: 1fr; }
    .project-note-grid { grid-template-columns: 1fr; }
    .profile-layout { grid-template-columns: 1fr; }
    .backup-card { align-items: flex-start; flex-wrap: wrap; }
    .backup-card .btn { width: 100%; }
    .contract-public-header { padding: 0 15px; }
    .contract-public-header > span { display: none; }
    .contract-public-header .brand strong { max-width: 240px; }
    .contract-document { width: calc(100vw - 18px); margin-top: 10px; }
    .contract-paper { padding: 27px 17px; border-radius: 12px; }
    .contract-paper > h1 { font-size: 22px; }
    .contract-parties { grid-template-columns: 1fr; }
    .contract-parties > i { display: none; }
    .contract-key-info { grid-template-columns: 1fr; }
    .signer-fields { grid-template-columns: 1fr; }
    .signed-grid { grid-template-columns: 1fr; }
    .signed-signature { align-items: flex-start; flex-direction: column; }
    .project-form-side,.contract-create-side { grid-template-columns: 1fr; }
    .project-form-actions { width: 100%; }
    .project-form-actions .btn { flex: 1; }
    .project-heading-actions { width: 100%; align-items: stretch; flex-direction: column; }
    .project-heading-actions .btn { width: 100%; }
    .drive-toolbar { align-items: stretch; flex-direction: column; }
    .drive-toolbar .filter-search,.drive-toolbar select,.drive-toolbar .btn { width: 100%; }
    .drive-note-grid,.customer-folder-grid,.drive-project-grid { grid-template-columns: 1fr; }
    .drive-form-grid { grid-template-columns: 1fr; }
    .drive-expiry-row { grid-template-columns: 1fr; }
    .customer-archive-main { align-items: flex-start; flex-wrap: wrap; }.customer-archive-main .btn { width: 100%; }.customer-archive-details { grid-template-columns: 1fr; }.asset-detail-list { grid-template-columns: 1fr; }.asset-expiry-grid { grid-template-columns: 1fr; }.section-heading { align-items: flex-start; flex-direction: column; }.section-actions { width: 100%; justify-content: space-between; }
}

/* Personal planner and private work log */
.privacy-banner { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; padding: 15px 18px; color: #31557a; background: #edf5ff; border: 1px solid #dbe9fb; border-radius: 14px; }
.privacy-banner > svg { width: 25px; height: 25px; flex: none; }
.privacy-banner strong { display: block; margin-bottom: 3px; }
.privacy-banner p { margin: 0; color: #66809a; font-size: 12px; }
.planner-metrics { display: grid; grid-template-columns: repeat(4,1fr); gap: 15px; margin-bottom: 20px; }
.planner-metrics article { padding: 18px 20px; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 7px 20px rgba(20,43,58,.04); }
.planner-metrics span,.planner-metrics small { display: block; color: var(--muted); }
.planner-metrics strong { display: block; margin: 7px 0 3px; font-size: 28px; }
.planner-metrics article.danger strong { color: var(--red); }
.planner-layout { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(330px,.75fr); gap: 18px; align-items: start; }
.planner-calendar { padding: 0; overflow: hidden; }
.planner-calendar > header { display: flex; align-items: center; justify-content: space-between; padding: 20px 22px; border-bottom: 1px solid var(--line); }
.planner-calendar > header div { text-align: center; }
.planner-calendar h2 { margin: 0 0 4px; font-size: 19px; }
.planner-calendar header p { margin: 0; color: var(--muted); font-size: 11px; }
.calendar-weekdays,.calendar-grid { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); }
.calendar-weekdays { padding: 10px 12px; color: #8a97a2; background: #fafbfc; border-bottom: 1px solid var(--line); text-align: center; font-size: 11px; }
.calendar-grid { padding: 12px; }
.calendar-empty,.calendar-day { min-height: 104px; }
.calendar-day { padding: 9px; border: 1px solid transparent; border-radius: 11px; overflow: hidden; transition: .18s; }
.calendar-day:hover { background: #f5f8ff; border-color: #dbe5fb; }
.calendar-day.today { background: #f1f5ff; }
.calendar-day.selected { border-color: #7794ea; box-shadow: inset 0 0 0 1px #7794ea; }
.calendar-day > span { display: flex; align-items: center; justify-content: space-between; margin-bottom: 7px; }
.calendar-day > span b { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 50%; }
.calendar-day.today > span b { color: #fff; background: var(--blue); }
.calendar-day > span em { min-width: 19px; padding: 2px 5px; color: #fff; background: #91a2b4; border-radius: 10px; font-size: 9px; font-style: normal; text-align: center; }
.calendar-day > small { display: block; margin-top: 4px; padding: 4px 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #4d5d6c; background: #f0f3f5; border-left: 3px solid #8fa1b1; border-radius: 4px; font-size: 10px; }
.calendar-day > small.priority-high { border-color: var(--orange); }.calendar-day > small.priority-urgent { color: #9c3941; background: #fff0f1; border-color: var(--red); }
.calendar-day > small.done { color: #9ba4aa; text-decoration: line-through; opacity: .7; }
.calendar-day > i { display: block; margin-top: 5px; color: var(--blue); font-size: 9px; font-style: normal; }.calendar-day > i.all-done { color: var(--green); }
.planner-day-panel { min-height: 520px; }
.personal-plan-list { display: grid; gap: 10px; }
.personal-plan-list > article { display: grid; grid-template-columns: 30px minmax(0,1fr) auto; gap: 10px; align-items: start; padding: 13px; background: #fafbfc; border: 1px solid var(--line); border-radius: 11px; }
.personal-plan-list > article.overdue { background: #fff7f7; border-color: #f4d6d9; }.personal-plan-list > article.done { opacity: .65; }
.plan-check { width: 25px; height: 25px; display: grid; place-items: center; padding: 0; color: #fff; background: #fff; border: 2px solid #cbd4db; border-radius: 50%; }
.done .plan-check { background: var(--green); border-color: var(--green); }.plan-check svg { width: 14px; }
.plan-item-head { display: flex; gap: 5px; margin-bottom: 5px; }.plan-category,.plan-priority { padding: 3px 7px; border-radius: 9px; color: #657582; background: #edf1f4; font-size: 9px; }.plan-priority.priority-urgent { color: #ac3943; background: #ffe9eb; }.plan-priority.priority-high { color: #a16b20; background: #fff2dc; }
.personal-plan-list strong { display: block; line-height: 1.5; }.personal-plan-list small,.personal-plan-list em { display: block; margin-top: 5px; color: var(--muted); font-size: 10px; font-style: normal; }.personal-plan-list em { display: flex; align-items: center; gap: 4px; color: #5978bd; }.personal-plan-list em svg { width: 12px; }.personal-plan-list p { margin: 8px 0 0; color: #63717c; font-size: 11px; line-height: 1.6; }
.planner-lower { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 18px; align-items: start; }
.plan-editor,.work-log-editor { scroll-margin-top: 90px; }.work-log-editor > label { display: block; margin-top: 13px; }.work-log-editor > label span,.work-log-footer label > span { display: block; margin-bottom: 7px; color: #596874; font-size: 11px; font-weight: 600; }.work-log-editor textarea { width: 100%; resize: vertical; }
.private-chip { display: inline-flex; align-items: center; gap: 5px; padding: 6px 9px; color: #5874a7; background: #edf3ff; border-radius: 12px; font-size: 10px; }.private-chip svg { width: 13px; }
.work-log-footer { display: flex; align-items: end; justify-content: space-between; gap: 15px; margin-top: 15px; padding-top: 15px; border-top: 1px solid var(--line); }.work-log-footer label { flex: 1; }.work-log-footer select { width: 100%; }
.project-attention-card { margin-top: 18px; }.attention-project-list { display: grid; gap: 7px; }.attention-project-list > a { display: grid; grid-template-columns: auto minmax(0,1fr) auto 20px; gap: 14px; align-items: center; padding: 13px 9px; border-bottom: 1px solid var(--line); }.attention-project-list > a:last-child { border-bottom: 0; }.attention-project-list strong,.attention-project-list small { display: block; }.attention-project-list small { margin-top: 4px; color: var(--muted); font-size: 10px; }.attention-project-list em { color: #657481; font-size: 11px; font-style: normal; }
.personal-dashboard-board { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(320px,.75fr); gap: 18px; margin-bottom: 20px; }.today-plan-board,.dashboard-project-board { padding-bottom: 12px; }.dashboard-personal-list,.dashboard-project-list { display: grid; gap: 4px; }.dashboard-personal-list > a { display: grid; grid-template-columns: 52px minmax(0,1fr) auto 18px; gap: 10px; align-items: center; padding: 10px 8px; border-bottom: 1px solid var(--line); }.dashboard-personal-list > a > span { color: #506275; font-size: 11px; font-weight: 700; }.dashboard-personal-list > a.late > span { color: var(--red); }.dashboard-personal-list strong,.dashboard-personal-list small { display: block; }.dashboard-personal-list small { margin-top: 3px; color: var(--muted); font-size: 10px; }.dashboard-personal-list em { padding: 4px 7px; border-radius: 9px; color: #697884; background: #eef1f3; font-size: 9px; font-style: normal; }.dashboard-personal-list em.priority-urgent { color: #ac3943; background: #ffe9eb; }
.today-plan-board > footer { display: flex; align-items: center; justify-content: space-between; margin: 12px 4px 0; padding: 12px 8px 0; color: #6d7d88; border-top: 1px solid var(--line); font-size: 10px; }.today-plan-board > footer span { display: flex; align-items: center; gap: 6px; }.today-plan-board > footer svg { width: 14px; }.today-plan-board > footer a { color: var(--blue); font-weight: 600; }
.dashboard-project-list > a { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 11px 7px; border-bottom: 1px solid var(--line); }.dashboard-project-list > a:last-child { border-bottom: 0; }.dashboard-project-list strong,.dashboard-project-list small { display: block; }.dashboard-project-list small { margin-top: 3px; color: var(--muted); font-size: 10px; }.dashboard-project-list em { color: #647480; font-size: 10px; font-style: normal; }

@media (max-width: 1100px) { .planner-layout,.personal-dashboard-board { grid-template-columns: 1fr; }.planner-lower { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .planner-metrics { grid-template-columns: 1fr 1fr; }.calendar-grid { min-width: 690px; }.planner-calendar { overflow-x: auto; }.planner-calendar > header,.calendar-weekdays { min-width: 690px; }.calendar-day { min-height: 92px; }.attention-project-list > a { grid-template-columns: auto minmax(0,1fr) 18px; }.attention-project-list em { grid-column: 2; }.dashboard-personal-list > a { grid-template-columns: 45px minmax(0,1fr) 18px; }.dashboard-personal-list > a > em { display: none; } }
@media (max-width: 480px) { .planner-metrics { grid-template-columns: 1fr; }.work-log-footer { align-items: stretch; flex-direction: column; }.work-log-footer .btn { width: 100%; }.privacy-banner { align-items: flex-start; } }

/* Company servers, encrypted credentials and project deployment links */
.custom-product-type { animation: formReveal .18s ease; }
@keyframes formReveal { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.server-kpis { display: grid; grid-template-columns: repeat(4,1fr); gap: 15px; margin-bottom: 18px; }
.server-kpis article { padding: 18px 20px; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 7px 20px rgba(20,43,58,.04); }
.server-kpis span { display: block; color: var(--muted); font-size: 11px; }.server-kpis strong { display: block; margin-top: 7px; color: #293e4d; font-size: 28px; }.server-kpis article.warning strong { color: var(--orange); }.server-kpis article.danger strong { color: var(--red); }.server-kpis article.muted { opacity: .7; }
.server-table .amount small { display: block; }.server-usage-list { display: grid; gap: 6px; min-width: 190px; }.server-usage-list a { display: block; padding-left: 9px; border-left: 2px solid #b9c8e9; }.server-usage-list strong,.server-usage-list small { display: block; }.server-usage-list strong { color: #435d8e; font-size: 10px; }.server-usage-list small { margin-top: 2px; color: var(--muted); font-size: 9px; }.server-usage-list em { color: var(--muted); font-size: 9px; font-style: normal; }
.server-status { display: inline-flex; padding: 5px 9px; color: #557181; background: #edf2f4; border-radius: 12px; font-size: 9px; font-weight: 700; }.server-status.status-active { color: #24775a; background: #e7f6ef; }.server-status.status-maintenance { color: #9a671f; background: #fff1db; }.server-status.status-expired,.server-status.status-stopped { color: #9e4048; background: #fdebed; }
.server-form { margin-top: 18px; scroll-margin-top: 90px; }.server-form-layout { display: grid; grid-template-columns: minmax(0,1.12fr) minmax(360px,.88fr); gap: 18px; padding: 0 22px 22px; }.server-form-layout > section { min-width: 0; padding: 17px; background: #fafbfc; border: 1px solid var(--line); border-radius: 13px; }.server-form-layout > section > h3 { margin: 0 0 15px; color: #40535f; font-size: 13px; }
.server-secret-section { padding: 14px; background: #edf4ff; border: 1px solid #d7e4fa; border-radius: 11px; }.server-secret-section > div:first-child { margin-bottom: 12px; }.server-secret-section > div:first-child strong { display: flex; align-items: center; gap: 7px; color: #35568e; }.server-secret-section > div:first-child strong svg { width: 16px; }.server-secret-section > div:first-child small { display: block; margin-top: 5px; color: #7186a4; font-size: 9px; line-height: 1.6; }
.secret-input { display: flex; align-items: stretch; }.secret-input input { min-width: 0; border-radius: 8px 0 0 8px; }.secret-input button,.secret-input > a { display: inline-flex; align-items: center; flex: none; padding: 0 10px; color: #42649e; background: #fff; border: 1px solid #d3dce8; border-left: 0; border-radius: 0; cursor: pointer; font-size: 10px; font-weight: 700; }.secret-input button:last-child,.secret-input > a:last-child { border-radius: 0 8px 8px 0; }.secret-input.secret-locked input { color: #8a96a3; background: #f5f7fa; }.secret-input.secret-locked > a { justify-content: center; min-width: 84px; }
.server-usage-selector > p { margin: -8px 0 14px; color: var(--muted); font-size: 10px; }.server-project-options { display: grid; gap: 9px; max-height: 710px; padding-right: 4px; overflow-y: auto; }.server-project-options > article { padding: 11px; background: #fff; border: 1px solid var(--line); border-radius: 10px; }.server-project-option,.server-site-options label { display: flex; align-items: flex-start; gap: 8px; cursor: pointer; }.server-project-option input,.server-site-options input { width: 16px; height: 16px; margin-top: 2px; accent-color: var(--blue); }.server-project-option span,.server-site-options span { min-width: 0; }.server-project-option strong,.server-project-option small,.server-site-options small { display: block; }.server-project-option strong { color: #3d5260; font-size: 11px; }.server-project-option small,.server-site-options small { margin-top: 3px; color: var(--muted); font-size: 9px; }.server-site-options { display: grid; gap: 7px; margin: 10px 0 0 24px; padding: 10px; background: #f6f8fa; border-radius: 8px; }.server-site-options label { color: #526571; font-size: 10px; }
.project-linked-servers { margin-top: 18px; scroll-margin-top: 90px; }.project-server-list { display: grid; grid-template-columns: 1fr 1fr; }.project-server-list > a { display: grid; grid-template-columns: 38px minmax(0,1fr) auto 18px; gap: 12px; align-items: center; min-height: 112px; padding: 17px 20px; border-top: 1px solid var(--line); }.project-server-list > a:nth-child(odd) { border-right: 1px solid var(--line); }.server-list-icon { width: 38px; height: 38px; display: grid; place-items: center; color: #4a6fc1; background: #eaf0ff; border-radius: 10px; }.server-list-icon svg { width: 19px; }.project-server-list small,.project-server-list em,.project-server-list p { display: block; }.project-server-list > a > div > small { color: #82909a; font-size: 9px; }.project-server-list strong { display: block; margin: 3px 0; color: #3f5360; }.project-server-list em { color: #6e7d87; font-size: 9px; font-style: normal; }.project-server-list p { margin: 7px 0 0; color: #526b9d; font-size: 9px; }.project-server-list > .project-expiry { text-align: right; }
.dashboard-server-reminders { margin-bottom: 20px; }.dashboard-server-list { display: grid; grid-template-columns: 1fr 1fr; }.dashboard-server-list > a { display: grid; grid-template-columns: 34px minmax(0,1fr) auto 16px; gap: 11px; align-items: center; min-height: 75px; padding: 13px 18px; border-top: 1px solid var(--line); }.dashboard-server-list > a:nth-child(odd) { border-right: 1px solid var(--line); }.dashboard-server-list > a > span { width: 34px; height: 34px; display: grid; place-items: center; color: #4d70bd; background: #edf2ff; border-radius: 9px; }.dashboard-server-list > a > span svg { width: 17px; }.dashboard-server-list strong,.dashboard-server-list small { display: block; }.dashboard-server-list small { margin-top: 4px; color: var(--muted); font-size: 9px; }.dashboard-server-list > a > b { color: #586a76; font-size: 10px; text-align: right; }

@media (max-width: 1100px) { .server-form-layout { grid-template-columns: 1fr; }.project-server-list,.dashboard-server-list { grid-template-columns: 1fr; }.project-server-list > a:nth-child(odd),.dashboard-server-list > a:nth-child(odd) { border-right: 0; } }
@media (max-width: 760px) { .server-kpis { grid-template-columns: 1fr 1fr; }.server-filter-form { flex-direction: column; }.server-filter-form > * { width: 100%; }.server-form-layout { padding: 0 12px 16px; }.project-server-list > a,.dashboard-server-list > a { grid-template-columns: 36px minmax(0,1fr) 16px; }.project-server-list > a > .project-expiry,.dashboard-server-list > a > b { grid-column: 2; text-align: left; } }
@media (max-width: 480px) { .server-kpis { grid-template-columns: 1fr; }.server-secret-section .field-grid { grid-template-columns: 1fr; } }

/* People, engineering delivery and finance operations */
.main-nav { flex: 1; min-height: 0; padding-right: 3px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.18) transparent; }.main-nav a { min-height: 43px; height: 43px; }.sidebar-help { margin-top: 12px; }
.nav-label-section { margin-top: 10px; padding-top: 15px; border-top: 1px solid rgba(255,255,255,.07); }
.ops-kpis,.finance-hero-kpis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 15px; margin-bottom: 18px; }.ops-kpis article,.finance-hero-kpis article { min-width: 0; padding: 18px 20px; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 7px 20px rgba(20,43,58,.04); }.ops-kpis span,.ops-kpis small,.finance-hero-kpis span,.finance-hero-kpis small { display: block; color: var(--muted); font-size: 10px; }.ops-kpis strong,.finance-hero-kpis strong { display: block; margin: 7px 0 3px; color: #304451; font-size: 25px; }.ops-kpis article.warning strong,.finance-hero-kpis article.warning strong { color: var(--orange); }.ops-kpis article.danger strong { color: var(--red); }
.ops-dashboard-strip { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 13px; margin-bottom: 20px; }.ops-dashboard-strip > a { display: grid; grid-template-columns: 38px minmax(0,1fr) 17px; gap: 11px; align-items: center; min-height: 78px; padding: 14px 16px; background: #fff; border: 1px solid var(--line); border-radius: 13px; box-shadow: 0 6px 18px rgba(20,43,58,.035); }.ops-dashboard-strip > a > span { width: 38px; height: 38px; display: grid; place-items: center; color: #4b70bd; background: #edf2ff; border-radius: 10px; }.ops-dashboard-strip > a > span svg { width: 18px; }.ops-dashboard-strip small,.ops-dashboard-strip strong { display: block; }.ops-dashboard-strip small { color: var(--muted); font-size: 9px; }.ops-dashboard-strip strong { margin-top: 4px; color: #40535f; font-size: 11px; }
.ops-form { max-width: 1050px; margin-top: 18px; scroll-margin-top: 90px; }.ops-form > .field-grid { padding: 0 22px 22px; }.ops-form-stack { display: grid; gap: 18px; }.attendance-status,.severity { display: inline-flex; padding: 5px 9px; border-radius: 12px; font-size: 9px; font-weight: 700; }.attendance-status { color: #3c6f5a; background: #e8f6ef; }.attendance-late,.attendance-early { color: #99661f; background: #fff1d9; }.attendance-absent { color: #a43f49; background: #fdebed; }.attendance-leave,.attendance-business,.attendance-remote { color: #46629b; background: #eaf0ff; }
.payroll-attendance-hint { display: block; margin-top: 7px; padding: 7px 9px; color: #6e7f91; background: #f3f6fa; border-radius: 7px; font-size: 9px; line-height: 1.5; }
.board-project-meta { display: flex; align-items: center; gap: 16px; margin-left: auto; padding: 0 15px; color: var(--muted); font-size: 10px; }.board-project-meta strong { color: #3f5665; }.board-project-meta a { color: var(--blue); font-weight: 700; }.kanban-board { display: grid; grid-template-columns: repeat(5,minmax(245px,1fr)); gap: 13px; align-items: start; margin-bottom: 18px; overflow-x: auto; padding: 1px 1px 12px; }.kanban-column { min-height: 450px; background: #eef2f5; border: 1px solid #e1e7ea; border-radius: 14px; overflow: hidden; }.kanban-column > header { display: flex; align-items: center; justify-content: space-between; padding: 14px 15px; color: #435663; font-size: 11px; font-weight: 700; }.kanban-column > header b { min-width: 24px; height: 24px; display: grid; place-items: center; color: #647785; background: #fff; border-radius: 12px; }.kanban-column > div { display: grid; gap: 9px; padding: 0 9px 12px; }.kanban-empty { padding: 30px 8px; color: #98a3aa; text-align: center; font-size: 10px; }.kanban-card { position: relative; padding: 13px; background: #fff; border: 1px solid #e1e6e9; border-radius: 11px; box-shadow: 0 5px 13px rgba(21,39,52,.04); }.kanban-card::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 3px; background: #8ca1b1; border-radius: 11px 0 0 11px; }.kanban-card.priority-high::before { background: var(--orange); }.kanban-card.priority-urgent::before { background: var(--red); }.kanban-card > small { color: #87939a; font-size: 8px; }.kanban-card h3 { margin: 7px 0; color: #3f515d; font-size: 11px; line-height: 1.5; }.kanban-card p { display: -webkit-box; margin: 0; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; color: #6a7982; font-size: 9px; line-height: 1.6; }.kanban-card footer { display: flex; align-items: center; justify-content: space-between; gap: 7px; margin-top: 11px; padding-top: 9px; border-top: 1px solid var(--line); }.kanban-card footer > span { color: #7d8b94; font-size: 8px; }.kanban-card footer select { max-width: 94px; height: 28px; padding: 0 6px; font-size: 8px; }
.dev-grid { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(330px,.7fr); gap: 18px; margin-bottom: 18px; }.repository-list { display: grid; }.repository-list > a { display: grid; grid-template-columns: 36px minmax(0,1fr) 18px; gap: 12px; align-items: center; padding: 14px 20px; border-top: 1px solid var(--line); }.repository-list > a > span { width: 36px; height: 36px; display: grid; place-items: center; color: #4b70bd; background: #edf2ff; border-radius: 9px; }.repository-list strong,.repository-list small,.repository-list em { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.repository-list small { margin-top: 3px; color: var(--muted); font-size: 9px; }.repository-list em { margin-top: 4px; color: #5572a9; font-size: 8px; font-style: normal; }.issue-status-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; padding: 15px 20px 20px; }.issue-status-summary span { padding: 13px; background: #f7f9fa; border: 1px solid var(--line); border-radius: 10px; text-align: center; }.issue-status-summary b,.issue-status-summary small { display: block; }.issue-status-summary b { color: #354d5c; font-size: 21px; }.issue-status-summary small { margin-top: 4px; color: var(--muted); font-size: 8px; }.severity-low { color: #617882; background: #eef2f4; }.severity-medium { color: #8b681e; background: #fff2d9; }.severity-high { color: #ad4b37; background: #ffede8; }.severity-critical { color: #9d303e; background: #ffe5e9; }.issue-status-form select { min-width: 96px; height: 31px; padding: 0 7px; font-size: 9px; }
.project-report-list { display: grid; gap: 14px; }.project-report-list > article { padding: 0; overflow: hidden; }.project-report-list article > header { display: flex; align-items: center; gap: 11px; padding: 15px 18px; background: #fafbfc; border-bottom: 1px solid var(--line); }.project-report-list header > div { flex: 1; }.project-report-list header strong,.project-report-list header small { display: block; }.project-report-list header small { margin-top: 4px; color: var(--muted); font-size: 9px; }.project-report-list header > b { color: #4a67a2; font-size: 10px; }.project-report-list article > div { display: grid; grid-template-columns: 1fr 1fr 1fr; }.project-report-list article section { min-height: 130px; padding: 16px 18px; border-right: 1px solid var(--line); }.project-report-list article section:last-child { border-right: 0; }.project-report-list article section.risk { background: #fff9ee; }.project-report-list article section > span { color: #73828c; font-size: 9px; font-weight: 700; }.project-report-list article section p { margin: 8px 0 0; color: #50616c; font-size: 10px; line-height: 1.75; }
.finance-report-grid { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(400px,.95fr); gap: 18px; margin-top: 18px; align-items: start; }.cashflow-table { padding: 0 20px 18px; }.cashflow-table > div { display: grid; grid-template-columns: 90px 1fr 1fr 1fr; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 9px; text-align: right; }.cashflow-table > div > span { color: var(--muted); text-align: left; }.cashflow-table > div > strong { color: #41535f; }

@media (max-width: 1180px) { .ops-kpis,.finance-hero-kpis,.ops-dashboard-strip { grid-template-columns: 1fr 1fr; }.dev-grid,.finance-report-grid { grid-template-columns: 1fr; }.project-report-list article > div { grid-template-columns: 1fr; }.project-report-list article section { min-height: 0; border-right: 0; border-bottom: 1px solid var(--line); } }
@media (max-width: 760px) { .ops-kpis,.finance-hero-kpis,.ops-dashboard-strip { grid-template-columns: 1fr; }.board-project-meta { width: 100%; margin: 10px 0 0; padding: 0; flex-wrap: wrap; }.kanban-board { margin-right: -20px; }.issue-status-summary { grid-template-columns: 1fr 1fr; }.cashflow-table { overflow-x: auto; }.cashflow-table > div { min-width: 500px; } }

/* Approval, audit and release governance */
.approval-status,.release-status{display:inline-flex;align-items:center;border-radius:999px;padding:5px 10px;font-size:11px;font-weight:800;background:#eef2f4;color:#58666d;white-space:nowrap}
.approval-pending,.release-planned,.release-checking{background:#fff4d9;color:#9a6510}.approval-approved,.approval-paid,.release-released{background:#e5f8ef;color:#15734e}.approval-rejected,.approval-cancelled,.release-rolled_back{background:#feeaea;color:#a23c3c}
.approval-actions form{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:220px}.approval-actions input{min-width:110px;max-width:180px;padding:7px 9px}
.environment-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.environment-card>span{font-size:10px;letter-spacing:.12em;font-weight:900;color:#6b7b83}.environment-card h3{margin:7px 0}.environment-card>a{display:block;color:var(--primary);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.environment-card dl{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 0}.environment-card dl div{padding:10px;background:#f7f9fa;border-radius:10px}.environment-card dt{font-size:10px;color:#89959b}.environment-card dd{margin:4px 0 0;font-size:12px;font-weight:800}
.release-list{display:grid;gap:16px}.release-card header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.release-card header h2{margin:8px 0 4px}.release-card header p{margin:0;color:#839097;font-size:11px}.release-card header>strong{font-size:22px;color:var(--primary)}
.release-notes{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:10px;margin:18px 0}.release-notes>div{padding:13px;border:1px solid #e8edef;border-radius:12px;background:#fafbfb}.release-notes b{font-size:11px}.release-notes p{font-size:12px;color:#627078;line-height:1.65;margin:7px 0 0}
.release-checklist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.release-checklist form button{width:100%;border:1px solid #e3e9eb;background:#fff;border-radius:10px;padding:10px;text-align:left;display:flex;align-items:center;gap:8px;color:#69777e;cursor:pointer}.release-checklist form.checked button{background:#edf9f4;border-color:#cbeadb;color:#177553}.release-checklist svg{width:17px;height:17px;flex:0 0 auto}.release-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px;padding-top:14px;border-top:1px solid #edf0f1}
.sensitive-badge{display:block;width:max-content;margin-top:5px;border-radius:5px;background:#fff0ef;color:#a8443c;padding:2px 6px;font-size:9px;font-weight:800}.password-force-alert{margin-bottom:16px}.password-force-alert strong{display:block;margin-bottom:3px}
@media(max-width:1100px){.environment-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.release-notes{grid-template-columns:1fr}}
@media(max-width:700px){.environment-grid,.release-checklist{grid-template-columns:1fr}.approval-actions form{min-width:180px}.release-card header{align-items:center}}

@media print {
    .contract-public-header, .no-print, .contract-sign-form, .contract-public-footer { display: none!important; }
    .contract-public-body { background: #fff; }
    .contract-document { width: 100%; margin: 0; }
    .contract-paper { padding: 20px; border: 0; box-shadow: none; }
}

/* Project recurring services and conversational filing */
.service-fee-editor { display: grid; gap: 13px; padding: 0 22px 22px; }
.service-fee-editor > article { padding: 15px; background: #f8fafb; border: 1px solid var(--line); border-radius: 12px; }
.service-fee-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 13px; }
.service-fee-title strong { color: #344b5a; font-size: 13px; }
.form-inline-tip { display: flex; align-items: center; gap: 8px; margin: 0 22px 20px; padding: 10px 12px; color: #60768a; background: #eff5ff; border-radius: 9px; font-size: 10px; line-height: 1.6; }
.form-inline-tip svg { width: 15px; flex: none; }
.project-service-fees { margin-top: 18px; scroll-margin-top: 90px; }
.service-fee-cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; padding: 0 20px 20px; }
.service-fee-cards > article { min-width: 0; padding: 17px; background: #f9fbfc; border: 1px solid var(--line); border-radius: 13px; }
.service-fee-cards > article.overdue { background: #fff8f7; border-color: #f0cfd1; }
.service-fee-cards header { display: flex; gap: 10px; align-items: center; }
.service-fee-cards header > span { width: 36px; height: 36px; display: grid; place-items: center; color: #476bb9; background: #eaf0ff; border-radius: 10px; }
.service-fee-cards header svg { width: 18px; }.service-fee-cards header strong,.service-fee-cards header small { display: block; }.service-fee-cards header small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.service-fee-amount { display: flex; align-items: baseline; gap: 5px; margin: 16px 0; }.service-fee-amount strong { color: #2e4655; font-size: 23px; }.service-fee-amount span { color: var(--muted); font-size: 9px; }
.service-fee-cards dl { display: grid; gap: 7px; margin: 0; }.service-fee-cards dl div { display: flex; justify-content: space-between; gap: 8px; padding-top: 7px; border-top: 1px solid #e8edef; }.service-fee-cards dt,.service-fee-cards dd { margin: 0; font-size: 9px; }.service-fee-cards dt { color: var(--muted); }.service-fee-cards dd { color: #455a67; font-weight: 700; text-align: right; }
.service-fee-cards > article > p { margin: 12px 0 0; color: #6e7c85; font-size: 9px; line-height: 1.6; }
.service-receipt-form { display: grid; gap: 8px; margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--line); }.service-receipt-form label span { display: block; margin-bottom: 5px; color: #71808a; font-size: 9px; }.service-receipt-form input { width: 100%; }.service-receipt-form .btn { width: 100%; }
.service-receipt-history { padding: 0 20px 20px; }.service-receipt-history h3 { margin: 0 0 10px; font-size: 12px; }

.drive-mode-switch { display: inline-flex; padding: 3px; background: #e9eef2; border-radius: 10px; }
.drive-mode-switch a { display: inline-flex; align-items: center; gap: 5px; padding: 8px 11px; color: #687985; border-radius: 8px; font-size: 10px; font-weight: 700; }.drive-mode-switch a.active { color: #385eaa; background: #fff; box-shadow: 0 3px 10px rgba(25,47,61,.09); }.drive-mode-switch svg { width: 14px; }
.assistant-page-heading { margin-bottom: 16px; }
.assistant-page-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; margin-bottom: 16px; }
.assistant-page-stats article { padding: 15px 17px; background: #fff; border: 1px solid var(--line); border-radius: 12px; }
.assistant-page-stats span,.assistant-page-stats strong { display: block; }.assistant-page-stats span { color: var(--muted); font-size: 9px; }.assistant-page-stats strong { margin-top: 5px; color: #355da9; font-size: 20px; }
.assistant-page-layout { display: grid; grid-template-columns: minmax(0,1fr) 285px; gap: 16px; align-items: start; }
.assistant-page-layout > main { min-width: 0; }.assistant-page-layout .drive-assistant { margin-bottom: 0; }
.assistant-page-side { display: grid; gap: 13px; }.assistant-page-side > section { padding: 18px; }
.assistant-side-icon { width: 40px; height: 40px; display: grid; place-items: center; color: #4268bb; background: #edf2ff; border-radius: 12px; }.assistant-side-icon.secure { color: #318064; background: #e9f7f1; }.assistant-side-icon svg { width: 19px; }
.assistant-page-side h2 { margin: 13px 0 9px; font-size: 13px; }.assistant-page-side p,.assistant-page-side li { color: #6e7c85; font-size: 9px; line-height: 1.7; }.assistant-page-side ul { display: grid; gap: 5px; margin: 0; padding-left: 17px; }
.assistant-page-links h2 { margin-top: 0; }.assistant-page-links a { display: grid; grid-template-columns: 30px minmax(0,1fr) 15px; align-items: center; gap: 8px; padding: 10px 0; color: inherit; border-top: 1px solid var(--line); }.assistant-page-links a > svg:first-child { width: 16px; color: #4c6fba; }.assistant-page-links a > svg:last-child { width: 13px; color: #9aa5aa; }.assistant-page-links strong,.assistant-page-links small { display: block; }.assistant-page-links strong { color: #50626c; font-size: 9px; }.assistant-page-links small { margin-top: 2px; color: var(--muted); font-size: 8px; }
.drive-assistant { margin-bottom: 20px; overflow: hidden; scroll-margin-top: 88px; border-color: #dce5f8; box-shadow: 0 14px 34px rgba(47,81,151,.09); }
.drive-assistant-head { display: flex; align-items: center; gap: 13px; padding: 20px 22px; color: #fff; background: linear-gradient(125deg,#173a5b,#3159a5 68%,#4c74c7); }.assistant-avatar { width: 48px; height: 48px; display: grid; place-items: center; flex: none; color: #345da8; background: #fff; border-radius: 15px; box-shadow: 0 8px 22px rgba(0,0,0,.12); }.assistant-avatar svg { width: 25px; }.drive-assistant-head > div { min-width: 0; flex: 1; }.drive-assistant-head .eyebrow { color: #b9ccf5; }.drive-assistant-head h2 { margin: 3px 0 5px; font-size: 19px; }.drive-assistant-head p { margin: 0; color: #d7e2f4; font-size: 10px; line-height: 1.6; }.assistant-online { display: inline-flex; align-items: center; gap: 6px; padding: 6px 9px; background: rgba(255,255,255,.12); border-radius: 12px; font-size: 9px; }.assistant-online i { width: 7px; height: 7px; background: #5ee0ac; border-radius: 50%; }
.assistant-session-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 16px; background: #fff; border-bottom: 1px solid #e4e9f1; }.assistant-session-list { display: flex; gap: 7px; min-width: 0; overflow-x: auto; scrollbar-width: thin; }.assistant-session-list form { flex: none; }.assistant-session-list button { display: grid; grid-template-columns: 18px minmax(70px,150px) auto; align-items: center; gap: 5px; max-width: 220px; padding: 7px 9px; color: #6b7b8b; background: #f4f6f9; border: 1px solid transparent; border-radius: 9px; }.assistant-session-list button.active { color: #365ca8; background: #edf3ff; border-color: #c9d7f2; }.assistant-session-list svg { width: 14px; }.assistant-session-list b { overflow: hidden; font-size: 9px; text-align: left; text-overflow: ellipsis; white-space: nowrap; }.assistant-session-list small { color: #91a0ae; font-size: 8px; }.assistant-session-actions { display: flex; align-items: center; gap: 5px; flex: none; }.assistant-session-actions form { margin: 0; }.assistant-session-actions .btn { white-space: nowrap; }
.assistant-conversation { display: grid; gap: 14px; max-height: 410px; padding: 20px 22px; overflow-y: auto; background: #f6f8fc; }.assistant-welcome { display: flex; align-items: flex-start; gap: 9px; max-width: 720px; padding: 12px 14px; color: #526577; background: #fff; border: 1px solid #e2e8f2; border-radius: 4px 13px 13px 13px; }.assistant-welcome svg { width: 16px; flex: none; color: #4e70b8; }.assistant-welcome p { margin: 0; font-size: 10px; line-height: 1.7; }
.assistant-turn { display: grid; gap: 9px; }.assistant-user-message { max-width: 72%; margin-left: auto; padding: 11px 13px; color: #fff; background: #4169c7; border-radius: 13px 4px 13px 13px; }.assistant-user-message strong,.assistant-user-message small { display: block; font-size: 8px; opacity: .75; }.assistant-user-message p { margin: 4px 0; font-size: 10px; line-height: 1.65; }.assistant-bot-message { display: flex; align-items: flex-start; gap: 9px; max-width: 76%; }.assistant-bot-message > span { width: 28px; height: 28px; display: grid; place-items: center; flex: none; color: #4169c7; background: #fff; border-radius: 9px; }.assistant-bot-message svg { width: 15px; }.assistant-bot-message > div { padding: 11px 13px; background: #fff; border: 1px solid #e2e8f2; border-radius: 4px 13px 13px 13px; }.assistant-bot-message strong { display: block; margin-bottom: 4px; color: #3e5d93; font-size: 9px; }.assistant-bot-message p { margin: 0; color: #526577; font-size: 10px; line-height: 1.65; }
.assistant-composer { padding: 18px 22px; }.assistant-target-row { display: flex; align-items: flex-end; gap: 12px; margin-bottom: 11px; }.assistant-target-row label { min-width: 320px; }.assistant-target-row label span { display: block; margin-bottom: 6px; color: #62727d; font-size: 9px; font-weight: 700; }.assistant-target-row > span { padding-bottom: 10px; color: #8b979e; font-size: 9px; }
.assistant-message-box { display: grid; grid-template-columns: minmax(0,1fr) 210px; border: 1px solid #d9e1e8; border-radius: 12px; overflow: hidden; }.assistant-message-box textarea { min-height: 94px; border: 0; border-radius: 0; resize: vertical; }.assistant-file-picker { position: relative; display: flex; flex-direction: column; justify-content: center; gap: 6px; padding: 16px; color: #48689f; background: #f0f4fc; border-left: 1px solid #dce4ef; cursor: pointer; }.assistant-file-picker input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }.assistant-file-picker b { display: flex; align-items: center; gap: 6px; font-size: 10px; }.assistant-file-picker svg { width: 15px; }.assistant-file-picker small { display: block; color: #8290a1; font-size: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.assistant-message-box.paste-active { border-color: #4f74c7; box-shadow: 0 0 0 4px rgba(79,116,199,.12); }.assistant-paste-preview { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 11px; padding: 11px; background: #f7f9fd; border: 1px dashed #cbd7ea; border-radius: 11px; }.assistant-paste-card { position: relative; width: 116px; padding: 6px; background: #fff; border: 1px solid #dce4ef; border-radius: 10px; }.assistant-paste-card img { display: block; width: 100%; height: 72px; object-fit: cover; background: #edf1f6; border-radius: 7px; }.assistant-paste-card small { display: block; margin-top: 6px; color: #647483; font-size: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.assistant-paste-remove { position: absolute; top: -7px; right: -7px; width: 22px; height: 22px; display: grid; place-items: center; padding: 0; color: #fff; background: #384f68; border: 2px solid #fff; border-radius: 50%; font-size: 15px; line-height: 1; }.assistant-composer.is-ocr-running .assistant-paste-remove { cursor: wait; opacity: .45; }.assistant-ocr-status { min-height: 16px; margin-top: 7px; color: #7c8996; font-size: 9px; }.assistant-composer.is-ocr-running .assistant-ocr-status { color: #4569b7; }.assistant-composer.is-ocr-running .assistant-ocr-status:before { content: ''; display: inline-block; width: 8px; height: 8px; margin-right: 6px; border: 2px solid #b9c9eb; border-top-color: #4569b7; border-radius: 50%; vertical-align: -1px; animation: assistant-spin .8s linear infinite; }@keyframes assistant-spin { to { transform: rotate(360deg); } }
.assistant-suggestions { display: flex; align-items: center; gap: 7px; margin-top: 11px; }.assistant-suggestions > button:not(.btn) { padding: 6px 9px; color: #62799d; background: #eef3fb; border: 0; border-radius: 9px; font-size: 9px; }.assistant-suggestions .btn { margin-left: auto; }.assistant-security,.assistant-readonly { display: flex; align-items: center; gap: 7px; padding: 10px 22px; color: #7c8992; background: #fafbfc; border-top: 1px solid var(--line); font-size: 9px; }.assistant-security svg,.assistant-readonly svg { width: 14px; flex: none; }
.drive-simple-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }.drive-simple-help { display: flex; align-items: center; gap: 14px; padding: 18px 20px; }.drive-simple-help > span { width: 42px; height: 42px; display: grid; place-items: center; flex: none; color: #456cb9; background: #edf2ff; border-radius: 12px; }.drive-simple-help h2 { margin: 0 0 5px; font-size: 14px; }.drive-simple-help p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.65; }
.floating-assistant-button { position: fixed; right: 24px; bottom: 22px; z-index: 45; display: grid; grid-template-columns: 36px auto; grid-template-rows: 18px 16px; column-gap: 9px; align-items: center; min-width: 146px; padding: 10px 14px 10px 10px; color: #fff; background: linear-gradient(135deg,#22456c,#4169c7); border: 1px solid rgba(255,255,255,.22); border-radius: 16px; box-shadow: 0 13px 30px rgba(35,65,120,.3); }.floating-assistant-button > span { grid-row: 1/3; width: 36px; height: 36px; display: grid; place-items: center; color: #355fa9; background: #fff; border-radius: 11px; }.floating-assistant-button svg { width: 19px; }.floating-assistant-button strong { align-self: end; font-size: 11px; }.floating-assistant-button small { color: #cbd8f0; font-size: 8px; }

.server-credential-lock{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px;padding:18px 22px;border:1px solid rgba(245,158,11,.3);background:linear-gradient(135deg,rgba(245,158,11,.08),rgba(255,255,255,.96))}.server-credential-lock>div{display:flex;align-items:center;gap:13px}.server-credential-lock>div>span{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#fff4d8;color:#b66b00}.server-credential-lock strong{display:block;color:var(--text)}.server-credential-lock p{margin:4px 0 0;color:var(--muted);font-size:10px}.server-unlock-form{display:flex;align-items:center;gap:9px}.server-unlock-form input{min-width:240px}

@media(max-width:1180px){.assistant-page-layout{grid-template-columns:1fr}.assistant-page-side{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1050px){.service-fee-cards{grid-template-columns:1fr}.assistant-message-box{grid-template-columns:1fr}.assistant-file-picker{border-left:0;border-top:1px solid #dce4ef}.drive-simple-grid{grid-template-columns:1fr}}
@media(max-width:700px){.drive-mode-switch{width:100%}.drive-mode-switch a{flex:1;justify-content:center}.assistant-page-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.assistant-page-side{grid-template-columns:1fr}.assistant-session-bar{align-items:stretch;flex-direction:column}.assistant-session-actions{justify-content:flex-end}.assistant-target-row{align-items:stretch;flex-direction:column}.assistant-target-row label{min-width:0}.assistant-user-message,.assistant-bot-message{max-width:92%}.assistant-suggestions{flex-wrap:wrap}.assistant-suggestions .btn{width:100%;margin-left:0}.floating-assistant-button{right:12px;bottom:12px;min-width:0}.floating-assistant-button strong,.floating-assistant-button small{display:none}.floating-assistant-button>span{grid-row:auto}.server-credential-lock,.server-unlock-form{align-items:stretch;flex-direction:column}.server-unlock-form input{min-width:0;width:100%}}