/* «Мой профиль» сверху доски (R14) и правка визитки на портале (R15) — profil.js, profil-pravka.js.
   Вид — прототип v23 (docs/superpowers/prototypes/liga-doska-rezidentov/rezidenty.css, блок «мой профиль»): фото 240,
   справа имя и паутинка; ниже «Кто видит визитку», «За неделю», действия. В правке — слева фото, в середине поля
   (между полями 28–32 px), справа навыки, под ними «Сохранить» и «Отмена». Токены — портала (--ink, --gold …). */
.pf{display:block;margin-top:40px}
.pf .lu{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pf-zagr-t{padding:28px;border:1px dashed var(--line);border-radius:4px;color:var(--muted)}
.pf-k{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--gold)}
.pf-prof{display:grid;grid-template-columns:240px minmax(0,1fr) minmax(300px,380px);gap:32px 48px;align-items:start}
.pf-av{display:inline-flex;align-items:center;justify-content:center;width:240px;height:240px;border-radius:4px;border:1px solid var(--sep);
  background:var(--bg);font-size:72px;font-weight:800;letter-spacing:-.02em;color:var(--gold);object-fit:cover}
.pf-t{display:flex;flex-direction:column;gap:14px;min-width:0}
.pf-t .pf-k{margin-bottom:-6px}
.pf-h{display:flex;align-items:center;flex-wrap:wrap;gap:8px;overflow-wrap:anywhere}
.pf-r{color:var(--soft);font-size:var(--fs-body,16px);line-height:1.45;margin-top:-6px}
.pf-site{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;margin-top:-6px;min-height:24px;font-size:13px;color:var(--ink);text-underline-offset:.2em;overflow-wrap:anywhere}
.pf-site .lu{width:13px;height:13px;color:var(--muted)}
.pf-meta{font-size:13px;color:var(--muted);line-height:1.5}
.pf-meta .dot{margin:0 6px}
.pf-tags{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.pf-tags li{font-size:13px;font-weight:600;line-height:1.2;padding:7px 10px;border:1px solid var(--sep);border-radius:4px;color:var(--ink)}
.pf-q b{display:block;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.pf-q p{font-size:15px;line-height:1.5;color:var(--soft);white-space:pre-line;overflow-wrap:anywhere}

/* паутинка: оценка человека поверх среднего по клубу */
.pf-nv>b{display:block;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--gold)}
.pf-p{display:block;width:100%;max-width:380px;height:auto;margin-top:8px;overflow:visible}
.pf-p text{font-size:12px;fill:var(--soft)}
.pf-p .pf-p-k{fill:none;stroke:var(--sep);stroke-width:1}
.pf-p .pf-p-z{fill:var(--gold);fill-opacity:.28;stroke:var(--gold);stroke-width:2;stroke-linejoin:round}
.pf-p .pf-p-s{fill:none;stroke:var(--ink);stroke-opacity:.7;stroke-width:1.5;stroke-dasharray:4 4;stroke-linejoin:round}
.pf-p .pf-p-v{font-weight:800;fill:var(--soft)}
.pf-p .pf-p-v.pf-vys{fill:var(--gold)}
.pf-p .pf-p-v.pf-niz{fill:var(--muted);font-weight:600}
.pf-nv-l{display:flex;justify-content:center;gap:20px;margin-top:8px;font-size:13px;color:var(--soft)}
.pf-nv-l span{display:inline-flex;align-items:center;gap:8px}
.pf-nv-l i{display:inline-block;width:18px;height:10px;border-radius:2px}
.pf-nv-l .ty{background:rgba(199,154,62,.35);border:2px solid var(--gold)}
.pf-nv-l .sr{height:0;border-top:2px dashed var(--ink);border-radius:0;opacity:.7}

/* низ профиля */
.pf-niz{margin-top:36px;padding-top:28px;border-top:1px solid var(--hair);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(260px,340px);gap:28px 48px;align-items:start}
.pf-niz h3{margin-bottom:12px}
.pf-vidy{display:grid;gap:10px}
.pf-vid-v{display:flex;flex-direction:column;gap:4px;padding:14px 18px 14px 50px;position:relative;border:1px solid var(--line);border-radius:4px;opacity:.6}
.pf-vid-v::before{content:"";position:absolute;left:18px;top:16px;width:18px;height:18px;border-radius:50%;border:1px solid var(--line)}
.pf-vid-v.on{opacity:1;border-color:var(--gold);background:rgba(199,154,62,.08)}
.pf-vid-v.on::before{border:6px solid var(--gold)}
.pf-vid-v b{font-size:16px;font-weight:700;color:var(--ink)}
.pf-vid-v span{font-size:14px;line-height:1.45;color:var(--soft)}
.pf-pod{margin-top:10px;font-size:13px;line-height:1.45;color:var(--muted)}
.pf-stat{display:grid;gap:12px}
.pf-stat div{display:flex;align-items:baseline;gap:12px;font-size:15px;line-height:1.4;color:var(--soft)}
.pf-stat b{flex:none;min-width:2ch;font-size:28px;font-weight:800;line-height:1;color:var(--gold)}
.pf-a{display:flex;flex-direction:column;align-items:stretch;gap:12px}
.pf-pr{font-size:14px;line-height:1.5;color:var(--muted)}
.pf-pr a{color:var(--ink);text-underline-offset:.2em}
.pf-ok{display:flex;align-items:flex-start;gap:8px;font-size:14px;line-height:1.45;color:#7FCB93}
.pf-ssl{padding:0;border:0;background:none;font:inherit;font-weight:600;color:var(--gold);text-decoration:underline;text-underline-offset:.2em;cursor:pointer}
.pf-ssl:focus-visible{outline:2px solid var(--focus);outline-offset:3px}

/* визитки ещё нет */
.pf-pust{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;padding:28px;border:1px dashed var(--line);border-radius:4px}
.pf-pust>div:first-child{max-width:60ch;display:flex;flex-direction:column;gap:8px}
.pf-pust p{color:var(--soft);line-height:1.55}
.pf-pust-a{display:flex;flex-wrap:wrap;gap:12px}

/* ===== правка (R15) ===== */
.pf-red .pf-t{gap:30px}
.pf-red .pf-t .pf-k{margin-bottom:-14px}
.pf-red-f{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.pf-zagr{width:240px;cursor:pointer;position:relative}
.pf-zagr:focus-within{outline:2px solid var(--focus);outline-offset:3px}
.pf-skr{position:absolute;width:0;height:0;margin:0;padding:0;border:0;opacity:0;-webkit-appearance:none;appearance:none;pointer-events:none}
.pf-pls{display:grid;grid-template-columns:1fr 1fr;gap:30px 24px}
.pf-pl{min-width:0;margin:0;padding:0;border:0;display:flex;flex-direction:column}
.pf-pl.shir{grid-column:1/-1}
.pf-pl>label,.pf-pl>legend,.pf-lb{display:block;padding:0;margin-bottom:10px;font-size:14px;font-weight:600;line-height:1.4;color:var(--ink)}
.pf-red .inp{height:46px;font-size:15px}
.pf-red .pf-ta{height:auto;min-height:84px;padding:12px 16px;line-height:1.5;resize:vertical}
.pf-sch{margin-top:4px;align-self:flex-end;font-size:12px;color:var(--muted)}
.pf-ist{display:inline-block;margin-left:6px;padding:2px 6px;border:1px solid var(--gold);border-radius:3px;font-size:11px;font-weight:700;letter-spacing:.02em;line-height:1.3;color:var(--gold);vertical-align:1px}
.pf-istoch{display:flex;gap:10px;align-items:flex-start;padding:14px 16px;border:1px solid var(--gold);border-radius:4px;background:rgba(199,154,62,.08);font-size:14px;line-height:1.5;color:var(--soft)}
.pf-istoch .lu{margin-top:2px;color:var(--gold)}
.pf-istoch b{color:var(--ink)}
.pf-tiles{display:flex;flex-wrap:wrap;gap:8px}
.pf-tiles.pf-stolbik{display:grid;gap:10px}
.pf-tile{position:relative;display:inline-flex;align-items:center;min-height:40px;padding:8px 14px;border:1px solid var(--line);border-radius:4px;font-size:14px;line-height:1.3;color:var(--ink);cursor:pointer;user-select:none}
.pf-tile:hover{border-color:var(--ink)}
.pf-tile:has(input:checked){border-color:var(--gold);background:rgba(199,154,62,.16)}
.pf-tile:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:2px}
.pf-tile-2{flex-direction:column;align-items:flex-start;gap:4px;padding:14px 18px 14px 50px}
.pf-tile-2::before{content:"";position:absolute;left:18px;top:16px;width:18px;height:18px;border-radius:50%;border:1px solid var(--line)}
.pf-tile-2:has(input:checked)::before{border:6px solid var(--gold)}
.pf-tile-2 b{font-size:16px;font-weight:700}
.pf-tile-2 span{font-size:14px;line-height:1.45;color:var(--soft)}
.pf-prk-v{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;margin-bottom:10px}
.pf-srch{position:relative;width:min(100%,280px)}
.pf-srch .lu{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--muted)}
.pf-srch .inp{padding-left:42px}
.pf-prk-n{font-size:13px;font-weight:600;color:var(--muted)}
.pf-gr{display:flex;flex-wrap:wrap;gap:8px;max-height:260px;overflow:auto;padding:2px}
.pf-gr .pf-tile[hidden]{display:none}
.pf-napr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.pf-polz{min-width:0;margin:28px 0 0;padding:0;border:0;display:grid;gap:18px}
.pf-polz legend{margin-bottom:10px;padding:0;font-size:14px;font-weight:600;color:var(--ink)}
.pf-pz{display:flex;flex-direction:column;gap:4px}
.pf-pz>b,.pf-pz>span>b{display:block;font-size:15px;color:var(--ink)}
/* вопрос-подсказка над звёздами — как в прототипе (.rz-pz small): мельче, приглушённо, курсивом */
.pf-vopr{display:block;margin-top:2px;font-size:13px;line-height:1.35;font-style:italic;color:var(--muted)}
.pf-vopr:empty{display:none}
.pf-zvv{display:flex;flex-wrap:wrap;align-items:center;gap:0}
.pf-zvv button{display:inline-flex;align-items:center;justify-content:center;width:30px;height:36px;padding:0;border:0;border-radius:4px;background:none;cursor:pointer}
.pf-zvv svg{width:22px;height:22px;fill:transparent;stroke:var(--line);stroke-width:1.6;transition:fill 120ms ease-out,stroke 120ms ease-out}
.pf-zvv button.on svg{fill:var(--gold);stroke:var(--gold)}
.pf-zvv button:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.pf-zvv-t{margin-left:8px;font-size:13px;font-weight:600;color:var(--soft);white-space:nowrap}
.pf-osh{margin-top:8px;font-size:14px;line-height:1.45;color:#F2A091}
.pf-osh:empty{display:none}
.pf-red .pf-a{margin-top:28px}
/* нижний ряд правки: «Кто видит» под фото и полями, кнопки под колонкой навыков по нижнему краю вариантов */
.pf-red>.pf-niz-red{grid-column:1/-1;display:grid;grid-template-columns:subgrid;align-items:end;gap:24px 48px;padding-top:28px;border-top:1px solid var(--hair)}
.pf-niz-vid{grid-column:1/3;min-width:0}
/* согласие на показ на сайте (R21): появляется под «Кто видит», когда выбрано «Все», а согласия ещё нет */
.pf-sogl{margin-top:16px;padding:14px 16px;border:1px solid var(--gold);border-radius:4px;background:rgba(199,154,62,.08);font-size:14px;line-height:1.5;color:var(--soft)}
.pf-sogl[hidden]{display:none}
.pf-sogl a{color:var(--gold)}
.pf-galka{display:flex;gap:10px;align-items:flex-start;margin-top:10px;color:var(--ink);cursor:pointer}
.pf-galka input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--gold);flex:none}
.pf-sogl-z{margin-top:14px}
.pf-sogl-z span{color:var(--soft)}
.pf-sogl-zz{display:flex;flex-wrap:wrap;gap:0 18px}
.pf-niz-red>.pf-a{grid-column:3;margin-top:0}
.pf-knopki{display:flex;flex-wrap:wrap;gap:12px}
.pf-red [aria-invalid="true"].inp,.pf-red [aria-invalid="true"] .pf-tile{border-color:#F2A091}
@media (prefers-reduced-motion:reduce){.pf-zvv svg{transition:none}}
@media (max-width:1180px){
  .pf-prof{grid-template-columns:200px minmax(0,1fr)}.pf-n{grid-column:1/-1}.pf-av{width:200px;height:200px}.pf-zagr{width:200px}
  .pf-niz{grid-template-columns:1fr 1fr}.pf-a{grid-column:1/-1}
  .pf-niz-vid,.pf-niz-red>.pf-a{grid-column:1/-1}
}
@media (max-width:720px){
  .pf-prof{grid-template-columns:minmax(0,1fr);gap:24px}.pf-av{width:160px;height:160px;font-size:48px}.pf-zagr{width:auto}
  .pf-niz{grid-template-columns:1fr}.pf-pls{grid-template-columns:1fr}.pf-napr{grid-template-columns:1fr}
}