/* Экран «Архитектура». Документ, а не дашборд: широкие поля, крупная
 * типографика, подписи под иллюстрациями. */

.arc-verify { padding: var(--s4); border-left: 3px solid var(--income); }
.arc-verify.bad { border-left-color: var(--expense); }
.arc-verify-t { font-weight: 650; font-size: var(--t-callout); color: var(--ink); }
.arc-verify.bad .arc-verify-t { color: var(--expense); }
.arc-verify-s { margin-top: var(--s1); font-size: var(--t-footnote); color: var(--ink-2);
                line-height: var(--lh-body); }
.arc-verify-row { margin-top: var(--s2); font-size: var(--t-footnote);
                  color: var(--expense); font-family: var(--font-mono); }

.arc-std { padding: var(--s4); }
.arc-h { font-weight: 650; font-size: var(--t-subhead); margin-bottom: var(--s2); }
.arc-std-row { font-size: var(--t-footnote); color: var(--ink-2);
               line-height: var(--lh-body); padding: 3px 0; }

/* Легенда */
.arc-legend { padding: var(--s2) 0; }
.arc-leg-row { display: flex; align-items: center; gap: var(--s3);
               padding: var(--s2) var(--s4); border-bottom: 1px solid var(--hairline); }
.arc-leg-row:last-child { border-bottom: 0; }
.arc-leg-mark { flex: 0 0 128px; overflow: hidden; height: 54px;
                display: flex; align-items: center; }
.arc-leg-mark svg { transform: scale(.72); transform-origin: left center; }
.arc-leg-text { font-size: var(--t-footnote); color: var(--ink-2);
                line-height: var(--lh-body); }

/* Иллюстрация */
.arc-fig { padding: var(--s3) 0 var(--s4); overflow: hidden; }
.arc-fig-head { display: flex; align-items: center; justify-content: space-between;
                gap: var(--s2); padding: 0 var(--s4) var(--s2); flex-wrap: wrap; }
.arc-fig-kind { font-size: var(--t-caption); text-transform: uppercase;
                letter-spacing: .04em; color: var(--ink-3); font-weight: 650; }
.arc-fig-tools { display: flex; align-items: center; gap: 6px; }
.arc-zoom { border: 1px solid var(--hairline-strong); background: var(--surface);
            color: var(--ink); border-radius: 8px; min-width: 30px; height: 28px;
            font-size: var(--t-footnote); cursor: pointer; }
.arc-zoom.wide { padding: 0 10px; }
.arc-pct { font-size: var(--t-caption); color: var(--ink-3); min-width: 34px;
           text-align: center; }

/* ⚠️ Прокрутка вбок — ВНУТРИ холста, а не у страницы: иначе вся вёрстка
 * приложения начинает ездить, и человек теряет нижнюю панель. */
.arc-canvas { overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch;
              padding: 0 var(--s4); }
.arc-svg { display: inline-block; min-width: 100%; }
.arc-stub { padding: var(--s6) var(--s4); color: var(--ink-3);
            font-size: var(--t-footnote); }

.arc-cap { padding: var(--s3) var(--s4) 0; font-size: var(--t-footnote);
           color: var(--ink); text-align: center; line-height: var(--lh-body); }
.arc-note { padding: var(--s2) var(--s4) 0; font-size: var(--t-footnote);
            color: var(--ink-2); line-height: var(--lh-body); }
.arc-note b { color: var(--ink); font-weight: 620; }
.arc-note p { margin: 0 0 var(--s2); }
.arc-note p:last-child { margin-bottom: 0; }

/* Подсистемы */
.arc-pick { display: flex; gap: var(--s2); overflow-x: auto; padding: 0 var(--s4) var(--s3);
            -webkit-overflow-scrolling: touch; }
.arc-chip { flex: 0 0 auto; border: 1px solid var(--hairline-strong);
            background: var(--surface); color: var(--ink); border-radius: 999px;
            padding: 7px 14px; font-size: var(--t-footnote); cursor: pointer; }
.arc-chip.on { background: var(--accent-fill); color: var(--ink-on-accent);
               border-color: var(--accent-fill); }

.arc-sub { padding: var(--s4); }
.arc-sub-t { font-weight: 650; font-size: var(--t-title3); color: var(--ink);
             display: flex; align-items: center; gap: var(--s2); flex-wrap: wrap; }
.arc-tag { font-size: var(--t-caption); font-weight: 600; color: var(--warn);
           background: var(--warn-soft); border-radius: 999px; padding: 2px 8px; }
.arc-sub-p { margin-top: var(--s2); font-size: var(--t-subhead); color: var(--ink-2);
             line-height: var(--lh-body); }
.arc-ref { margin-top: var(--s3); font-size: var(--t-caption); }
.arc-ref-k { color: var(--ink-3); text-transform: uppercase; letter-spacing: .04em;
             font-weight: 650; margin-right: var(--s2); }
.arc-ref-v code { font-family: var(--font-mono); font-size: var(--t-caption);
                  color: var(--ink-2); }

/* Полноэкранный просмотр */
.arc-full { position: fixed; inset: 0; z-index: 900; background: var(--canvas);
            display: flex; flex-direction: column; }
.arc-full-bar { display: flex; align-items: center; justify-content: space-between;
                gap: var(--s3); padding: calc(env(safe-area-inset-top) + 10px) var(--s4) 10px;
                border-bottom: 1px solid var(--hairline); background: var(--surface); }
.arc-full-t { font-size: var(--t-footnote); font-weight: 650; color: var(--ink); }
.arc-full-body { flex: 1; overflow: auto; -webkit-overflow-scrolling: touch;
                 padding: var(--s4); }
.arc-full-zoom { position: absolute; right: var(--s4);
                 bottom: calc(env(safe-area-inset-bottom) + var(--s4));
                 display: flex; gap: 6px; }
.arc-full-zoom .arc-zoom { width: 44px; height: 44px; font-size: var(--t-title3);
                           box-shadow: 0 2px 10px rgba(0,0,0,.16); }