html.pers-appraisal-open { overflow:hidden; }
.pers-appraisal { box-sizing:border-box; width:min(560px, calc(100% - 32px)); max-height:calc(100dvh - 32px); margin:auto; padding:40px; border:1px solid #e3e1de; border-radius:10px; background:#fff; color:#231f20; font-family:Jost,sans-serif; overflow:auto; overscroll-behavior:contain; }
.pers-appraisal::backdrop { background:rgb(35 31 32 / .35); }
.pers-appraisal h2 { margin:0 32px 12px 0; font:300 34px/1.15 Jost,sans-serif; }
.pers-appraisal p { margin:0; font-size:16px; line-height:1.5; }
.pers-appraisal__form { display:flex; flex-direction:column; gap:0; margin-top:20px; }
.pers-appraisal__form label { display:grid; margin:0; gap:6px; font-size:15px; line-height:1.4; }
.pers-appraisal__form input[type=text], .pers-appraisal__form input[type=tel] { box-sizing:border-box; width:100%; height:48px; margin:0; padding:10px 12px; border:1px solid #b8b3ad; border-radius:0; background:#fff; color:#231f20; font:400 16px/1.4 Jost,sans-serif; caret-color:#744b3a; }
.pers-appraisal__form label + label { margin-top:16px; }
.pers-appraisal__form input::placeholder { color:#70675f; }
.pers-appraisal fieldset { min-width:0; margin:16px 0 0; padding:0; border:0; }
.pers-appraisal legend { padding:0; margin-bottom:8px; font-size:15px; }
.pers-appraisal button { font-family:Jost,sans-serif; cursor:pointer; }
.pers-appraisal__actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:16px; }
.pers-appraisal .pers-appraisal__actions button { min-height:44px; flex:1; padding:10px 12px; border:1px solid #744b3a; border-radius:0; background:#fff; color:#744b3a; font-size:15px; }
.pers-appraisal .pers-appraisal__actions button:is(:hover, :focus-visible, :active) { background:#f4eeea; color:#744b3a; border-color:#744b3a; }
.pers-appraisal .pers-appraisal__submit { min-height:48px; padding:12px 20px; border:1px solid #744b3a; border-radius:0; background:#744b3a; color:white; font-size:16px; line-height:1.4; }
.pers-appraisal .pers-appraisal__submit:is(:hover, :focus-visible, :active) { background:#5e3a2c; color:#fff; border-color:#5e3a2c; }
.pers-appraisal .pers-appraisal__close { position:absolute; top:12px; right:12px; display:grid; place-items:center; width:44px; height:44px; padding:0; border:0; background:transparent; color:#231f20; font-size:24px; line-height:1; }
.pers-appraisal h2:focus { outline:none; }
.pers-appraisal .pers-appraisal__intro { margin-right:32px; }
.pers-appraisal__photos { display:grid; grid-template-columns:repeat(3,minmax(0,80px)); gap:12px; padding:0; margin:12px 0 0; list-style:none; }
.pers-appraisal__photos:empty, .pers-appraisal__status:empty { display:none; }
.pers-appraisal__photos li { min-width:0; margin:0; padding:0; }
.pers-appraisal__photos img { display:block; width:100%; aspect-ratio:1; object-fit:cover; }
.pers-appraisal__photos button { min-height:44px; width:100%; padding:6px 0; border:0; background:transparent; color:#744b3a; text-decoration:underline; text-underline-offset:3px; font-size:14px; }
.pers-appraisal .pers-appraisal__status { margin-top:8px; font-size:14px; line-height:1.4; }
.pers-appraisal .is-error { color:#9b2525; }
.pers-appraisal button:disabled { opacity:.55; cursor:wait; }
.pers-appraisal :focus-visible { outline:2px solid #744b3a; outline-offset:3px; }
.pers-appraisal ::selection { background:#e8ded4; color:#231f20; }

.pers-appraisal .pers-appraisal__photos button:is(:hover, :focus-visible, :active) { background:transparent; color:#5e3a2c; }
.pers-appraisal .pers-appraisal__close:is(:hover, :focus-visible, :active) { background:transparent; color:#744b3a; }

.pers-appraisal [hidden] { display:none!important; }
.pers-appraisal__transfer { display:grid; gap:24px; margin-top:24px; }
.pers-appraisal__transfer:focus { outline:none; }
.pers-appraisal__progress { display:block; appearance:none; width:100%; height:6px; border:0; border-radius:0; background:#e8ded4; color:#744b3a; accent-color:#744b3a; overflow:hidden; }
.pers-appraisal__progress::-webkit-progress-bar { background:#e8ded4; }
.pers-appraisal__progress::-webkit-progress-value { background:#744b3a; }
.pers-appraisal__progress::-moz-progress-bar { background:#744b3a; }
.pers-appraisal__progress:indeterminate { background:#744b3a; animation:pers-appraisal-wait 1.6s ease-in-out infinite; }
.pers-appraisal__progress:indeterminate::-webkit-progress-bar { background:transparent; }
.pers-appraisal .pers-appraisal__wait { color:#655b54; font-size:14px; }
@keyframes pers-appraisal-wait { 0%,100% { opacity:.35; } 50% { opacity:1; } }
@media(prefers-reduced-motion:reduce) { .pers-appraisal__progress:indeterminate { animation:none; background:#744b3a; } }

.pers-appraisal__percent { color:#744b3a; font-size:14px; font-variant-numeric:tabular-nums; margin-top:-16px; }
.pers-appraisal__percent:empty { display:none; }


.pers-appraisal__form > .pers-appraisal__submit { margin-top:16px; }
@media(max-width:600px) {
 .pers-appraisal { padding:16px 20px; max-height:calc(100dvh - 24px); }
 .pers-appraisal h2 { font-size:26px; margin-bottom:8px; }
 .pers-appraisal__actions { margin-top:12px; }
 .pers-appraisal .pers-appraisal__intro { font-size:15px; line-height:1.4; }
 .pers-appraisal__form { margin-top:12px; }
 .pers-appraisal__form label { gap:4px; }
 .pers-appraisal__form label + label, .pers-appraisal fieldset { margin-top:12px; }
 .pers-appraisal__form input[type=text], .pers-appraisal__form input[type=tel] { height:44px; }
 .pers-appraisal__photos { grid-template-columns:repeat(3,minmax(0,64px)); }
 .pers-appraisal .pers-appraisal__status { margin-top:4px; font-size:13px; line-height:1.35; }
 .pers-appraisal__form > .pers-appraisal__submit { margin-top:12px; }
}

.pers-appraisal [data-pick][data-limit-reached="true"]:disabled { cursor:not-allowed; }
