@charset "utf-8";
/* «Совместимость пары» (/ru/sovmestimost/para/): форма на двоих и списки сохранённых. Плашки — общие стили .vse-* из site.css. */
.slab form.para-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 26px;align-items:start}
.para-col{display:flex;flex-direction:column;gap:12px;min-width:0;padding-top:4px}
.para-col+.para-col{border-left:1px solid rgba(255,255,255,.12);padding-left:26px}
.para-col .f input,.para-col .f select{min-width:0;width:100%;box-sizing:border-box}
.para-row{display:flex;gap:12px;align-items:flex-end}
.para-row .f:first-child{flex:1 1 auto}
.para-row .fchk{flex:0 0 auto}
.para-row .fchk label{white-space:nowrap}
/* «Она» / «Он» — заголовок колонки и выбор пола сразу */
.slab .para-who select{font:600 26px/1.15 var(--display);color:var(--gold);background:transparent;border:0;border-bottom:1px dashed rgba(216,184,106,.45);
  border-radius:0;padding:0 26px 3px 0;width:auto;height:auto;min-width:0;cursor:pointer;-webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='%23D8B86A' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 4px center}
.slab .para-who select:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.slab .para-who select option{font:400 16px var(--body);color:#17120A;background:#fff}
.para-who{align-self:flex-start}
.slab form.para-form .go{grid-column:1/-1;justify-self:start;margin-top:4px}
/* сохранённые люди */
.para-saved{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:2px}
.para-saved[hidden]{display:none}
.para-saved-t{flex-basis:100%;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--slab-muted)}
.para-chip{display:inline-flex;align-items:stretch;border:1px solid rgba(255,255,255,.2);border-radius:999px;overflow:hidden;max-width:100%}
.para-chip button{font:500 13.5px/1 var(--body);color:var(--slab-ink);background:transparent;border:0;cursor:pointer;padding:8px 12px}
.para-chip .para-pick{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:190px}
.para-chip .para-del{padding:8px 10px 8px 2px;color:var(--slab-muted);font-size:15px}
.para-chip:hover{border-color:var(--gold)}
.para-chip .para-del:hover{color:var(--gold)}
.para-chip.on{border-color:var(--gold);background:rgba(216,184,106,.14)}
.para-chip.on .para-pick{color:var(--gold)}
@media (max-width:720px){
  .slab form.para-form{grid-template-columns:minmax(0,1fr);gap:22px}
  .para-col+.para-col{border-left:0;padding-left:0;border-top:1px solid rgba(255,255,255,.12);padding-top:18px}
  .slab form.para-form .go{width:100%}
}