/* Connected Community — Панель администратора → «Архитектура»: схема портала деревом (13.10.2026).
   Часть оформления портала. Файлы подключаются в templates/index.html по порядку номеров: поздние правила перебивают ранние. */
.arch{max-width:1180px;}
.arch-root{display:flex;align-items:center;gap:16px;padding:18px 22px;border:2px solid var(--orange);border-radius:18px;background:var(--orange-tint);position:relative;z-index:1;}
.arch-root-mark{width:54px;height:54px;flex:none;border-radius:16px;display:grid;place-items:center;background:var(--orange);color:var(--surface);font-size:26px;}
.arch-root-title{font:800 22px/1.2 'Golos Text',sans-serif;color:var(--ink);}
.arch-root-sub{margin-top:3px;font-size:14px;color:var(--ink-soft);}
.arch-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.arch-chip{padding:4px 10px;border-radius:999px;border:1px solid var(--border);background:var(--surface);font-size:12.5px;color:var(--ink-soft);}
.arch-chip b{color:var(--ink);font-weight:700;margin-left:3px;}

/* ствол и ветки: у каждой ветки своя дуга от ствола, ствол тянется до последней ветки */
.arch-tree{margin-left:46px;padding-top:6px;}
.arch-branch{position:relative;padding:20px 0 4px 44px;}
.arch-branch::before{content:'';position:absolute;left:0;top:0;width:36px;height:48px;border-left:2px solid var(--orange-soft);border-bottom:2px solid var(--orange-soft);border-bottom-left-radius:18px;}
.arch-branch::after{content:'';position:absolute;left:0;top:0;bottom:0;border-left:2px solid var(--orange-soft);}
.arch-branch:last-child::after{display:none;}

.arch-node{display:flex;align-items:center;gap:14px;}
.arch-ico{width:56px;height:56px;flex:none;border-radius:50%;display:grid;place-items:center;font-size:24px;background:hsl(var(--h) 75% 93%);color:hsl(var(--h) 60% 36%);border:2px solid hsl(var(--h) 60% 78%);}
.arch-title{font:800 17px/1.25 'Golos Text',sans-serif;color:var(--ink);display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;}
.arch-fact{font:600 12.5px/1.3 'Roboto',sans-serif;color:hsl(var(--h) 55% 36%);}
.arch-text{margin-top:2px;font-size:13.5px;line-height:1.45;color:var(--ink-soft);}

/* листья: веточка от значка ветки вниз, на ней карточки */
.arch-leaves{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px;margin:12px 0 6px 27px;padding:4px 0 4px 26px;border-left:2px dashed hsl(var(--h) 45% 78%);}
.arch-leaf{position:relative;padding:10px 12px;border:1px solid var(--border);border-top:3px solid hsl(var(--h) 60% 62%);border-radius:12px;background:var(--surface);min-width:0;}
.arch-leaf b{display:block;font:700 14px/1.3 'Golos Text',sans-serif;color:var(--ink);overflow-wrap:anywhere;}
.arch-leaf span{display:block;margin-top:3px;font-size:12.5px;line-height:1.45;color:var(--ink-soft);overflow-wrap:anywhere;}
.arch-items{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px;}
.arch-items i{font-style:normal;font-size:12px;padding:2px 8px;border-radius:999px;background:hsl(var(--h) 70% 94%);color:hsl(var(--h) 55% 30%);}

/* цепочка шагов: пронумерованные карточки, читаются слева направо и сверху вниз */
.arch-flow{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin:12px 0 6px 27px;padding:4px 0 4px 26px;border-left:2px dashed hsl(var(--h) 45% 78%);}
.arch-step{position:relative;min-width:0;padding:10px 12px 10px 44px;border:1px solid hsl(var(--h) 55% 80%);border-radius:12px;background:hsl(var(--h) 75% 97%);}
.arch-step em{position:absolute;left:10px;top:10px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font:800 12.5px/1 'Golos Text',sans-serif;font-style:normal;background:hsl(var(--h) 60% 50%);color:var(--surface);}
.arch-step b{display:block;font:700 14px/1.3 'Golos Text',sans-serif;color:var(--ink);overflow-wrap:anywhere;}
.arch-step span{display:block;margin-top:3px;font-size:12.5px;line-height:1.45;color:var(--ink-soft);overflow-wrap:anywhere;}

html[data-theme="dark"] .arch-ico{background:hsl(var(--h) 35% 22%);color:hsl(var(--h) 75% 80%);border-color:hsl(var(--h) 40% 38%);}
html[data-theme="dark"] .arch-fact{color:hsl(var(--h) 70% 76%);}
html[data-theme="dark"] .arch-leaves,html[data-theme="dark"] .arch-flow{border-left-color:hsl(var(--h) 30% 36%);}
html[data-theme="dark"] .arch-leaf{border-top-color:hsl(var(--h) 55% 50%);}
html[data-theme="dark"] .arch-items i{background:hsl(var(--h) 35% 24%);color:hsl(var(--h) 75% 84%);}
html[data-theme="dark"] .arch-step{background:hsl(var(--h) 30% 18%);border-color:hsl(var(--h) 35% 34%);}
html[data-theme="dark"] .arch-step em{background:hsl(var(--h) 55% 46%);color:var(--ink);}

@media (max-width:760px){
  .arch-root{padding:14px;gap:12px;align-items:flex-start;}
  .arch-root-mark{width:44px;height:44px;font-size:22px;}
  .arch-root-title{font-size:19px;}
  .arch-tree{margin-left:18px;}
  .arch-branch{padding-left:26px;}
  .arch-branch::before{width:20px;height:42px;}
  .arch-ico{width:44px;height:44px;font-size:20px;}
  .arch-leaves,.arch-flow{margin-left:0;padding-left:14px;grid-template-columns:1fr;}
}

/* ---- техническая схема (13.10.2026): путь запроса по узлам и карточки-паспорта ---- */
.arch-mode{margin:0 0 16px;}
.arch-tech{max-width:1180px;}
.arch-path{display:flex;align-items:stretch;gap:0;margin-bottom:16px;padding:14px;border:1px solid var(--border);border-radius:14px;background:var(--surface);overflow-x:auto;}
.arch-hop{flex:1 0 118px;min-width:0;padding:10px 12px;border:2px solid var(--orange-soft);border-radius:12px;background:var(--orange-tint);text-align:center;}
.arch-hop b{display:block;font:800 14.5px/1.25 'Golos Text',sans-serif;color:var(--ink);}
.arch-hop span{display:block;margin-top:3px;font:500 11.5px/1.35 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--ink-soft);overflow-wrap:anywhere;}
.arch-link{flex:1 0 92px;display:flex;align-items:center;justify-content:center;position:relative;padding:0 6px;}
.arch-link::before{content:'';position:absolute;left:0;right:6px;top:50%;border-top:2px solid var(--orange);}
.arch-link::after{content:'';position:absolute;right:0;top:50%;margin-top:-5px;border:5px solid transparent;border-left-color:var(--orange);border-right-width:0;}
.arch-link span{position:relative;top:-13px;font:600 10.5px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--ink-soft);text-align:center;background:var(--surface);padding:0 4px;}
.arch-tcard{border-top:3px solid hsl(var(--h) 60% 58%);min-width:0;}
.arch-thead{display:flex;align-items:center;gap:12px;margin-bottom:8px;}
.arch-thead .arch-ico{width:42px;height:42px;font-size:19px;}
.arch-thead .adm-card-title{margin-bottom:0;}
.arch-tsub{font:500 12px/1.3 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--ink-soft);overflow-wrap:anywhere;}
.arch-trow{align-items:flex-start;}
.arch-trow span:last-child{text-align:right;min-width:0;overflow-wrap:anywhere;}
.arch-trow code{font:500 12.5px/1.45 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--ink);background:none;padding:0;white-space:normal;overflow-wrap:anywhere;}
.arch-na{color:var(--ink-soft);font-size:12.5px;}
.arch-tfoot{margin-top:2px;font-size:12.5px;color:var(--ink-soft);}
html[data-theme="dark"] .arch-tcard{border-top-color:hsl(var(--h) 55% 50%);}
@media (max-width:760px){
  .arch-path{flex-direction:column;gap:0;}
  .arch-hop{flex:none;}
  .arch-link{flex:none;height:38px;}
  .arch-link::before{left:50%;right:auto;top:0;bottom:8px;border-top:none;border-left:2px solid var(--orange);}
  .arch-link::after{right:auto;left:50%;top:auto;bottom:0;margin:0 0 0 -4px;border:5px solid transparent;border-top-color:var(--orange);border-bottom-width:0;}
  .arch-link span{top:0;left:14px;}
  .arch-trow{flex-direction:column;gap:2px;}
  .arch-trow span:last-child{text-align:left;}
}
