:root { --primary: #004080; --bg: #fafafa; }
body { font-family: -apple-system, "Segoe UI", Roboto, sans-serif; margin: 0; background: var(--bg); color: #333; }
header { background: var(--primary); color: #fff; padding: 12px 24px; display: flex; justify-content: space-between; align-items: center; }
header a { color: #fff; text-decoration: none; margin-left: 16px; }
main { max-width: 1100px; margin: 24px auto; padding: 0 16px; }

/* === Карта процесса: визуальное полотно (волна UX-карты, 2026-09-21 08:53) === */
.map-canvas { background:#fff; border:1px solid #ddd; border-radius:8px; padding:1rem; overflow-x:auto; }
.map-flow { display:flex; flex-wrap:nowrap; align-items:stretch; gap:0; min-width:max-content; padding:0.5rem 0; }
.map-node-wrap { display:flex; align-items:center; flex-shrink:0; }
.map-node { min-width:130px; max-width:170px; background:#eef4fb; border:1px solid #b9cfe8; border-radius:8px; padding:0.5rem; font-size:0.85rem; box-shadow:0 1px 2px rgba(0,64,128,.08); }
.map-node--problem { background:#fff1f1; border-color:#e8b4b4; }
.map-node__head { font-weight:700; color:#004080; font-size:0.8rem; }
.map-node--problem .map-node__head { color:#b30000; }
.map-node__name { font-weight:600; margin-top:0.15rem; }
.map-node__meta { color:#555; font-size:0.75rem; margin-top:0.15rem; }
.map-node__problems { margin-top:0.35rem; }
.map-node__problem { color:#b30000; font-size:0.72rem; background:#fff; border:1px solid #e8b4b4; border-radius:4px; padding:0.15rem 0.3rem; margin-top:0.2rem; }
.map-arrow { display:flex; flex-direction:column; align-items:center; padding:0 0.4rem; flex-shrink:0; }
.map-arrow__line { font-size:1.5rem; color:#004080; line-height:1; }
.map-arrow__time { font-size:0.7rem; color:#666; white-space:nowrap; }
.map-returns { position:static; }
.map-return { margin-top:0.3rem; font-size:0.72rem; color:#8a6d3b; background:#fdf6e3; border:1px dashed #d4b96a; border-radius:4px; padding:0.15rem 0.3rem; white-space:nowrap; }

/* === Сайдбар проекта (по образцу 65.com.ru layout-project) === */
.project-layout { display:flex; gap:1.5rem; align-items:flex-start; margin-top:1rem; }
.project-sidebar { min-width:260px; max-width:300px; background:#eeeeee; border-radius:6px; padding:0.75rem 0; flex-shrink:0; }
.project-sidebar__group { padding:0.5rem 1rem 0.25rem; font-weight:700; color:#333; font-size:0.9rem; }
.project-sidebar__list { list-style:none; margin:0; padding:0; }
.project-sidebar__link { display:block; padding:0.4rem 1rem; color:#004080; text-decoration:none; font-size:0.9rem; }
.project-sidebar__link:hover { background:#e0e0e0; }
.project-sidebar__link.active { background:#004080; color:#fff; }
.project-sidebar__link.active:hover { background:#003366; }
.project-content { flex:1; min-width:0; }
