/* Окна личного портала: «Мой профиль» (карта 10012739).
   Правила перенесены 1-в-1 из <style> эскиза пакета 195 окна 83 (вариант 240): только те, чей
   селектор называет класс или атрибут разметки перенесённых экранов и рельса окна. Оболочка и
   рамка демонстрации эскиза (html, body, :root, .hd, .apps …) не переносятся. Местные имена
   цветов эскиза (--line, --mut, --ok …) заменены токенами темы --ge-*: своих значений цвета здесь
   нет. Всё ограничено окном #view-profile — общие имена (.btn, .chip, .data-table) за его
   пределы не выходят. */

/* Величины рельса и малой кнопки — из :root эскиза (не цвета). */
#view-profile{--gus-w:var(--ge-side-w,420px);--gus-row:32px;--gus-burger-w:34px;--ctl-h-sm:24px;--pad:20px}

/* Раскладка окна: рельс слева, экран справа — правила .shell/.work эскиза. */
#view-profile .shell{flex:1;display:flex;min-height:0;min-width:0}
#view-profile .work{flex:1 1 auto;min-width:0;min-height:0;padding:0;position:relative}
#view-profile .work>section[data-screen]{padding:var(--pad)}
#view-profile .work>section[data-screen].pane{padding:0;position:relative;min-height:640px}
#view-profile .work>section[data-screen].pane>.inner{padding:var(--pad)}
#view-profile h3{font-size:16px;font-weight:600;margin-bottom:3px}
#view-profile [data-screen].on{display:block}
@media (max-width:1023px){
#view-profile .shell{flex-direction:column}
#view-profile{--pad:14px}
}

#view-profile .gus-rail{ width: var(--gus-w); flex: 0 0 var(--gus-w); box-sizing: border-box;
  background: var(--ge-color-surface,#fff); color: var(--ge-color-text,#201f1e);
  border-right: 1px solid var(--ge-color-border,#edebe9);
  display: flex; flex-direction: column; padding: 10px 8px; gap: 2px;
  font: 14px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; min-height: 0; }
#view-profile .gus-head{ display: flex; align-items: center; gap: 8px;
  padding: 4px 6px 8px calc((var(--gus-mini-w, 56px) - var(--gus-burger-w, 34px)) / 2);
  border-bottom: 1px solid var(--ge-color-border,#edebe9); margin-bottom: 6px; }
#view-profile .gus-hubspace{ flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 9px; height: 38px;
  padding: 0 9px 0 11px; border: 1px solid var(--ge-color-border,#edebe9); border-radius: 9px;
  background: var(--ge-color-bg,#faf9f8); cursor: pointer; color: inherit; text-decoration: none; }
#view-profile .gus-hubspace:hover{ border-color: var(--ge-color-text-mute,#605e5c); }
#view-profile .gus-hubspace .gus-hstx{ min-width: 0; flex: 1; }
#view-profile .gus-hubspace .gus-hstx b{ font-size: 12.5px; font-weight: 600; white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; display: block; }
#view-profile .gus-list{ flex: 1; overflow-y: auto; overflow-x: hidden; min-width: 0;
  display: flex; flex-direction: column; gap: 1px; padding-bottom: 6px; }
#view-profile .gus-hsec{ margin: 2px 0 4px; }
#view-profile .gus-hsec-h{ display: flex; align-items: center; gap: 8px; padding: 9px 10px 5px; cursor: default; }
#view-profile .gus-hsec-h .gus-hn{ flex: 1 1 auto; font-size: 10.5px; font-weight: 700; letter-spacing: .11em;
  text-transform: uppercase; color: var(--ge-color-text-mute,#605e5c);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#view-profile .gus-hsec-h .gus-hc{ flex: 0 0 auto; font-size: 10px; color: var(--ge-color-text-faint,#726f6d);
  font-variant-numeric: tabular-nums; }
#view-profile .gus-hitem{ position: relative; display: flex; align-items: center; gap: 8px; min-height: var(--gus-row);
  padding: 5px 10px 5px 10px; border-radius: 0; text-decoration: none; color: var(--ge-color-text,#201f1e);
  border: 0; background: transparent; width: 100%; font: inherit; text-align: left; cursor: pointer; }
#view-profile .gus-hitem:hover{ background: var(--ge-color-hover,#f3f2f1); }
#view-profile .gus-hitem .gus-hdot{ flex: 0 0 18px; width: 18px; height: 18px; background: none; }
#view-profile .gus-hitem .gus-ht{ flex: 1 1 auto; font-size: 13px; font-weight: 500; white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; }
#view-profile .gus-hitem[data-current="true"]{ background: var(--ge-color-brand-soft,rgba(79,70,229,.1)); font-weight: 600; }
#view-profile .gus-hitem[data-current="true"] .gus-ht{ color: var(--ge-color-brand,#4f46e5); }
#view-profile .gus-hitem[data-current="true"]::before{ content: ""; position: absolute; left: 0; top: 6px; bottom: 6px;
  width: 2.5px; border-radius: 0 3px 3px 0; background: var(--ge-color-brand,#4f46e5); }
#view-profile .gus-hsec-div{ height: 1px; background: var(--ge-color-hover,#f3f2f1); margin: 6px 8px; }
#view-profile .gus-foot{ border-top: 1px solid var(--ge-color-border,#edebe9); padding-top: 6px;
  display: flex; flex-direction: column; gap: 1px; }
#view-profile .gus-foot a{ display: flex; align-items: center; gap: 11px; padding: 7px 9px; border-radius: 0;
  text-decoration: none; color: var(--ge-color-text-mute,#605e5c); font-size: 13px; }
#view-profile .gus-foot a:hover{ background: var(--ge-color-hover,#f3f2f1); color: var(--ge-color-text,#201f1e); }
#view-profile .data-table{ width: 100%; border-collapse: collapse; font-size: 14px; }
#view-profile .data-table th{ text-align: start; color: var(--ge-color-text-faint); font-weight: 600; font-size: 12px;
  text-transform: uppercase; letter-spacing: .5px; padding: 7px 12px;
  border-bottom: 1px solid var(--ge-color-border); }
#view-profile .data-table td{ padding: 7px 12px; border-bottom: 1px solid var(--ge-color-border); }
#view-profile .btn{ font: inherit; cursor: pointer; border-radius: var(--ge-radius-md);
  padding: 8px 14px; border: 1px solid var(--ge-color-border);
  background: var(--ge-color-surface); color: var(--ge-color-text);
  min-height: var(--ge-control-h); display: inline-flex; align-items: center; justify-content: center;
  gap: 6px; white-space: nowrap; line-height: 1; box-sizing: border-box; }
#view-profile .btn:hover{ background: var(--ge-color-hover); }
#view-profile .btn-primary{ background: var(--ge-color-brand); border: none; color: var(--ge-color-on-fill,#ffffff);
  font-weight: 600; }
#view-profile .btn-primary:hover{ background: var(--ge-color-brand-hover); }
#view-profile .btn-sm{ font: inherit; font-size: 12px; padding: 4px 10px; border-radius: var(--ge-radius-sm,3px);
  border: 1px solid var(--ge-color-border-strong,#d2d0ce); background: var(--ge-color-surface,#fff);
  color: var(--ge-color-text,#201f1e); cursor: pointer; min-height: var(--ge-control-h-sm);
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  white-space: nowrap; line-height: 1; box-sizing: border-box; }
#view-profile .btn-sm:hover{ background: var(--ge-color-hover,#f3f2f1); }
#view-profile .btn-sm:disabled{ opacity: .55; cursor: not-allowed; background: var(--ge-color-surface,#fff); }
#view-profile .btn-sm.btn-primary{ background: var(--ge-color-brand,#4f46e5); border-color: var(--ge-color-brand,#4f46e5);
  color: var(--ge-color-on-fill,#ffffff); }
#view-profile .btn-sm.btn-primary:hover{ background: var(--ge-color-brand-hover,#4338ca);
  border-color: var(--ge-color-brand-hover,#4338ca); }
#view-profile .auth-input{ box-sizing: border-box; width: 100%; height: 44px; padding: 0 var(--ge-space-3); font: inherit;
  border: 1px solid var(--ge-color-border-strong); border-radius: var(--ge-radius-md);
  background: var(--ge-color-bg); color: var(--ge-color-text);
  transition: border-color .12s, box-shadow .12s; }
#view-profile .auth-input::placeholder{ color: var(--ge-color-text-faint); }
#view-profile .auth-input:focus{ outline: none; border-color: var(--ge-color-brand);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ge-color-brand) 22%, transparent); }
@media (max-width: 640px){
#view-profile .gus-rail{ width: auto; flex: none; border-right: 0;
    border-bottom: 1px solid var(--ge-color-border,#edebe9); }
#view-profile .gus-list{ overflow: visible; }
}
#view-profile .chip{display:inline-flex;align-items:center;height:var(--ctl-h-sm);padding:0 9px;border:1px solid var(--ge-color-border);
       border-radius:calc(var(--ctl-h-sm)/2);font-size:11px;line-height:1;color:var(--ge-color-text-mute);background:var(--ge-color-surface-sunken);white-space:nowrap}
#view-profile .wrap{min-width:0}
#view-profile .lead{font-size:12px;color:var(--ge-color-text-mute);margin-bottom:16px;max-width:740px;line-height:1.55}
#view-profile .frame{position:relative;background:var(--ge-color-surface);border:1px solid var(--ge-color-border);border-radius:6px}
#view-profile table.data-table{table-layout:fixed}
#view-profile table.data-table th{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#view-profile table.data-table td{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}
#view-profile .sui-es{display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:12px;padding:32px 16px;text-align:center;color:var(--ge-color-text,#201f1e);
    font:inherit;min-height:220px}
#view-profile .sui-es-mark{display:grid;place-items:center;width:44px;height:44px;
    border-radius:12px;background:var(--ge-color-brand-soft,#eef2ff);color:var(--ge-color-brand,#4f46e5)}
#view-profile .sui-es-mark svg{width:22px;height:22px}
#view-profile .sui-es-title{margin:0;font-size:16px;font-weight:600;letter-spacing:-.012em;line-height:1.2}
#view-profile .sui-es-text{max-width:52ch;font-size:13.5px;line-height:1.55;color:var(--ge-color-text-mute,#605e5c)}
#view-profile .sp{flex:1}
#view-profile .df{display:flex;align-items:center;gap:8px;padding:10px 16px;border-top:1px solid var(--ge-color-border);background:var(--ge-color-surface-sunken)}
#view-profile .df .hint{font-size:11px;color:var(--ge-color-text-faint)}
#view-profile .cath{display:flex;align-items:center;gap:8px;height:32px;padding:0 11px;background:var(--ge-color-surface-sunken)}
#view-profile [data-screen]{display:none}
@media (max-width:1023px){
#view-profile .gus-rail{width:auto;flex:0 0 auto;border-right:0;
              border-bottom:1px solid var(--ge-color-border);padding:6px 8px}
#view-profile .gus-head,
#view-profile .gus-foot,
#view-profile .gus-hsec-div,
#view-profile .gus-hsec-h{display:none}
#view-profile .gus-list{flex-direction:row;gap:4px;overflow-x:auto;overflow-y:hidden;padding-bottom:0}
#view-profile .gus-hsec{margin:0;display:flex;gap:4px;align-items:center}
#view-profile .gus-hsec-items{display:flex;gap:4px}
#view-profile .gus-hitem{width:auto;white-space:nowrap;padding:6px 10px;min-height:0}
#view-profile .gus-hitem .gus-hdot{display:none}
#view-profile .gus-hitem[data-current="true"]::before{display:none}
}
@media (max-width:640px){
#view-profile .df{flex-wrap:wrap}
#view-profile .df .btn{flex:1}
#view-profile .df .hint{flex-basis:100%}
}
#view-profile .idn-sub{font-size:11px;color:var(--ge-color-text-mute);margin-top:2px;line-height:1.45}
#view-profile .idn-faint{color:var(--ge-color-text-faint)}
#view-profile .idn-mono{font-family:var(--ge-font-mono);font-size:12px}
#view-profile .idn-num{font-variant-numeric:tabular-nums;white-space:nowrap}
#view-profile .idn-c{margin:8px 0 0}
#view-profile .idn-h{margin-top:26px}
#view-profile .idn-two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
#view-profile .idn-gap2{margin-top:14px}
#view-profile .idn-scrhead{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
#view-profile .idn-fld{display:flex;flex-direction:column;gap:4px;font-size:11px;color:var(--ge-color-text-mute)}
#view-profile .idn-fld .auth-input{width:100%}
#view-profile .idn-sect{padding:12px 16px}
#view-profile .chip.ok{color:var(--ge-color-ok);border-color:var(--ge-color-ok-border);background:var(--ge-color-ok-bg)}
#view-profile .chip.warn{color:var(--ge-color-warn);border-color:var(--ge-color-warn-border);background:var(--ge-color-warn-bg)}
#view-profile .chip.err{color:var(--ge-color-err);border-color:var(--ge-color-err-border);background:var(--ge-color-err-bg)}
#view-profile .chip.acc{color:var(--ge-color-brand);border-color:var(--ge-color-brand);background:var(--ge-color-brand-soft)}
#view-profile .sp{flex:1 1 auto}
@media (max-width:1023px){
#view-profile .idn-two{grid-template-columns:1fr}
}
#view-profile .hint{font-size:11px;color:var(--ge-color-text-faint)}
#view-profile .cab-val{display:grid;grid-template-columns:minmax(170px,max-content) minmax(0,1fr);
    gap:5px 14px;font-size:12.5px;margin-top:9px;max-width:900px}
#view-profile .cab-val dt{color:var(--ge-color-text-mute)}
#view-profile .cab-val dd{margin:0;color:var(--ge-color-text)}
#view-profile .cab-val dd b{font-weight:600}
#view-profile col.c-cabmod{width:22%}
#view-profile col.c-cabwhat{width:34%}
#view-profile col.c-cabval{width:28%}
#view-profile col.c-cabsrc{width:16%}
#view-profile table.data-table td.txt,
#view-profile table.data-table th.txt{white-space:normal;overflow:visible;text-overflow:clip}
#view-profile .layer .dr{width:100%;background:var(--ge-color-surface); box-shadow:var(--ge-shadow-drawer);display:flex;flex-direction:column}
#view-profile .dh{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--ge-color-border)}
#view-profile section.pane>.layer{position:absolute;top:0;right:0;bottom:0;z-index:3;display:block; width:min(var(--ge-drawer-w),100%)}
#view-profile section.pane>.layer .dr{height:100%;border-left:1px solid var(--ge-color-border)}
#view-profile .idn-body{flex:1 1 auto;overflow-y:auto}
#view-profile .idn-ghost{opacity:.55}
#view-profile section[data-screen="общие-сведения-карточка"]>.layer{width:min(var(--ge-drawer-w-md),100%)}