/* Design A5 — dark pro console (dark literals; accent hue from vars) */
.A5 { position: relative; display: flex; min-height: 100vh; background: #0b0f16; color: #e6e9ef; font-size: 14px; overflow: hidden; }
.A5-glow { position: fixed; top: -160px; right: -120px; width: 520px; height: 520px; border-radius: 50%; background: var(--accent); opacity: .13; filter: blur(90px); pointer-events: none; z-index: 0; }

.A5-side { position: sticky; top: 0; height: 100vh; z-index: 3; width: 248px; flex: none; background: rgba(255,255,255,.025); backdrop-filter: blur(14px); border-right: 1px solid rgba(255,255,255,.07); display: flex; flex-direction: column; }
.A5-brand { display: flex; align-items: center; gap: 11px; padding: 22px 20px 18px; }
.A5-bn { font-weight: 700; font-size: 15px; line-height: 1.2; }
.A5-bn small { display: block; font-family: var(--display); font-size: 8.5px; letter-spacing: .3em; color: var(--accent); margin-top: 2px; }
.A5-nav { display: flex; flex-direction: column; gap: 2px; padding: 8px 12px; flex: 1; overflow-y: auto; }
.A5-navit { position: relative; display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; color: #8b93a1; font-size: 13.5px; text-align: left; transition: .16s; }
.A5-navit:hover { background: rgba(255,255,255,.05); color: #e6e9ef; }
.A5-navit.on { background: color-mix(in srgb, var(--accent) 16%, transparent); color: var(--accent-2); font-weight: 600; }
.A5-navit.on .A5-navic { color: var(--accent); }
.A5-navit.on::before { content: ""; position: absolute; left: -12px; top: 8px; bottom: 8px; width: 3px; border-radius: 0 3px 3px 0; background: var(--accent); box-shadow: 0 0 10px var(--accent); }
.A5-navlb { flex: 1; }
.A5-badge { background: var(--accent); color: #0b0f16; font-size: 11px; font-weight: 700; min-width: 19px; height: 19px; border-radius: 999px; display: grid; place-items: center; padding: 0 5px; }
.A5-user { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-top: 1px solid rgba(255,255,255,.07); }
.A5-ui { flex: 1; min-width: 0; line-height: 1.3; } .A5-ui b { display: block; font-size: 13px; } .A5-ui span { font-size: 11px; color: #8b93a1; }
.A5-lo { color: #8b93a1; padding: 6px; border-radius: 8px; } .A5-lo:hover { background: rgba(255,255,255,.06); color: #e6e9ef; }
.A5-ov { position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 2; }

.A5-main { position: relative; z-index: 1; flex: 1; min-width: 0; display: flex; flex-direction: column; }
.A5-top { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; gap: 16px; padding: 14px 28px; background: rgba(11,15,22,.72); backdrop-filter: blur(12px); border-bottom: 1px solid rgba(255,255,255,.07); }
.A5-burger { display: none; color: #e6e9ef; }
.A5-top h1 { font-size: 19px; font-weight: 700; }
.A5-search { margin-left: auto; display: flex; align-items: center; gap: 9px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.09); border-radius: 10px; padding: 9px 13px; color: #8b93a1; }
.A5-search input { border: none; background: none; outline: none; font-size: 13px; width: 190px; color: #e6e9ef; }
.A5-ti { position: relative; color: #8b93a1; padding: 8px; border-radius: 10px; } .A5-ti:hover { background: rgba(255,255,255,.06); color: #e6e9ef; }
.A5-ti.dot::after { content: ""; position: absolute; top: 7px; right: 8px; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 6px var(--accent); }

.A5-scroll { padding: 24px 28px 96px; display: flex; flex-direction: column; gap: 20px; }
.A5-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.A5-kpi { background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.08); border-radius: 16px; padding: 16px 18px; backdrop-filter: blur(8px); transition: .2s; }
.A5-kpi:hover { border-color: color-mix(in srgb, var(--accent) 45%, transparent); box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent), 0 8px 26px rgba(0,0,0,.4); }
.A5-krow { display: flex; align-items: center; justify-content: space-between; }
.A5-kl { font-size: 12.5px; color: #8b93a1; }
.A5-kd { font-size: 12px; font-weight: 700; display: inline-flex; align-items: center; gap: 2px; }
.A5-kd.up { color: #46d78a; } .A5-kd.dn { color: #f0776b; }
.A5-kv { font-size: 27px; font-weight: 700; margin: 6px 0 10px; }
.A5-kh { font-size: 11px; color: #8b93a1; margin-top: 8px; }

.A5-card { background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.08); border-radius: 18px; padding: 20px 22px; backdrop-filter: blur(8px); }
.A5-chd { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.A5-chd h2 { font-size: 15.5px; font-weight: 700; }
.A5-more { font-size: 12px; color: var(--accent-2); font-weight: 600; cursor: pointer; }
.A5-add { display: inline-flex; align-items: center; gap: 6px; background: var(--accent); color: #0b0f16; font-size: 13px; font-weight: 700; padding: 8px 14px; border-radius: 10px; }
.A5-add:hover { filter: brightness(1.08); }

.A5-grid2 { display: grid; grid-template-columns: 1.7fr 1fr; gap: 20px; }
.A5-revv { font-size: 30px; font-weight: 700; margin-bottom: 16px; }
.A5-revv small { display: block; font-size: 12px; font-weight: 400; color: #8b93a1; margin-top: 3px; }
.A5-months { display: flex; justify-content: space-between; margin-top: 8px; font-size: 10px; color: #6b7280; }

.A5-tasks { list-style: none; }
.A5-tasks li { display: flex; align-items: center; gap: 11px; padding: 10px 2px; border-bottom: 1px solid rgba(255,255,255,.06); }
.A5-tasks li:last-child { border-bottom: none; }
.A5-tl { flex: 1; min-width: 0; line-height: 1.35; } .A5-tl b { display: block; font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .A5-tl span { font-size: 11px; color: #8b93a1; }
.A5-pri { flex: none; width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; font-size: 10.5px; font-weight: 700; }
.A5-pri.p高 { background: rgba(240,119,107,.16); color: #f0776b; }
.A5-pri.p中 { background: color-mix(in srgb, var(--accent) 20%, transparent); color: var(--accent-2); }
.A5-pri.p低 { background: rgba(255,255,255,.07); color: #8b93a1; }

.A5-twrap { overflow-x: auto; margin: 0 -22px -20px; }
.A5-table { width: 100%; border-collapse: collapse; min-width: 640px; }
.A5-table th { text-align: left; font-size: 11px; font-weight: 600; color: #8b93a1; padding: 8px 14px; border-bottom: 1px solid rgba(255,255,255,.08); }
.A5-table th:first-child { padding-left: 22px; } .A5-table th:last-child { padding-right: 22px; }
.A5-table td { padding: 11px 14px; border-bottom: 1px solid rgba(255,255,255,.06); font-size: 13px; }
.A5-table td:first-child { padding-left: 22px; } .A5-table td:last-child { padding-right: 22px; }
.A5-table tr:last-child td { border-bottom: none; }
.A5-table tbody tr:hover { background: rgba(255,255,255,.04); }
.A5-cli { display: flex; align-items: center; gap: 10px; } .A5-clt b { display: block; font-size: 13px; font-weight: 600; } .A5-clt span { font-size: 10.5px; color: #8b93a1; }
.A5-mono { font-family: var(--mono); font-size: 12.5px; color: #8b93a1; }
.A5-chip { font-size: 11.5px; font-weight: 600; padding: 4px 11px; border-radius: 999px; }
.A5-chip.ok { background: rgba(70,215,138,.15); color: #46d78a; }
.A5-chip.warn { background: color-mix(in srgb, var(--accent) 22%, transparent); color: var(--accent-2); }
.A5-chip.mute { background: rgba(255,255,255,.07); color: #8b93a1; }

.A5-inq { list-style: none; }
.A5-inq li { display: flex; align-items: center; gap: 14px; padding: 12px 2px; border-bottom: 1px solid rgba(255,255,255,.06); }
.A5-inq li:last-child { border-bottom: none; }
.A5-qd { flex: none; width: 42px; color: #8b93a1; }
.A5-qi { flex: 1; min-width: 0; line-height: 1.35; } .A5-qi b { display: block; font-size: 13px; font-weight: 600; } .A5-qi span { font-size: 11px; color: #8b93a1; }
.A5-ist { flex: none; font-size: 11.5px; font-weight: 600; padding: 4px 11px; border-radius: 999px; }
.A5-ist.warn { background: rgba(240,119,107,.15); color: #f0776b; }
.A5-ist.info { background: color-mix(in srgb, var(--accent) 20%, transparent); color: var(--accent-2); }
.A5-ist.done { background: rgba(255,255,255,.07); color: #8b93a1; }
.A5-foot { text-align: center; font-size: 11px; color: #6b7280; padding-top: 4px; }

@media (max-width: 980px) {
  .A5-side { position: fixed; left: 0; top: 0; transform: translateX(-100%); transition: transform .25s; }
  .A5-side.open { transform: none; }
  .A5-burger { display: inline-flex; }
  .A5-kpis { grid-template-columns: repeat(2, 1fr); }
  .A5-grid2 { grid-template-columns: 1fr; }
  .A5-search input { width: 120px; }
}
@media (max-width: 640px) {
  .A5-kpis { grid-template-columns: 1fr 1fr; gap: 12px; }
  .A5-top { padding: 12px 16px; } .A5-scroll { padding: 16px 16px 92px; }
  .A5-search { display: none; }
}