.personal-page { min-height: calc(100vh - 84px); padding: 70px 0 90px; background: linear-gradient(120deg, #faf8f5 55%, #f2e8e7 55%); }
.personal-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(50px, 8vw, 120px); align-items: start; }
.personal-kicker { margin: 0 0 12px; color: var(--primary); font-size: 12px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }
.personal-intro h1 { margin: 0; font: 54px/.98 var(--serif); }
.personal-intro > p:not(.personal-kicker) { color: var(--muted); line-height: 1.65; }
.personal-note { margin-top: 34px; padding: 18px; border-radius: 15px; background: var(--accent); font-size: 13px; }
.personal-note span { color: var(--primary-dark); margin-right: 7px; }
.personal-card { padding: 38px; border-radius: 28px; background: white; box-shadow: 0 22px 65px rgba(31,16,22,.09); }
.personal-form { display: grid; gap: 28px; }
.photo-field { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 22px; align-items: center; }
.photo-field>div:last-child{min-width:0;overflow:hidden}
.photo-preview { position:relative;width: 110px; aspect-ratio:4/5; display: grid; place-items: center; overflow: hidden; border: 2px dashed #d4c1c5; border-radius: 16px; color: var(--primary); background: #f8f1f2; cursor: pointer; transition: border-color .15s, background .15s; }
.photo-preview:hover, .reading-photo-preview:hover { border-color: var(--primary); background: #f3e4e6; }
.photo-preview img { width: 100%; height: 100%; object-fit: cover; object-position:center; }
.photo-preview:has(img)::after { content:"Enquadramento 4:5";position:absolute;right:5px;bottom:5px;left:5px;padding:4px;border-radius:7px;color:#fff;background:rgba(31,16,22,.58);font-size:8px;font-weight:800;text-align:center;pointer-events:none; }
.photo-field label, .form-field label { display: block; margin-bottom: 7px; font-size: 13px; font-weight: 700; }
.photo-field small, .form-field small { display: block; margin-top: 5px; color: var(--muted); font-size: 11px; }
.field-caption { display: block; margin-bottom: 7px; font-size: 13px; font-weight: 700; }
.photo-field input[type=file], .reading-photo-slot input[type=file] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.file-trigger { display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px; border: 1px solid var(--primary); border-radius: 999px; color: var(--primary-dark); background: #fff; font-size: 12px; font-weight: 800; cursor: pointer; transition: .15s; }
.file-trigger:hover { background: #faf1f2; }
.file-trigger:active { transform: scale(.97); }
.photo-preview-empty { display: grid; justify-items: center; gap: 6px; padding: 8px; font-size: 11px; font-weight: 800; text-align: center; }
.photo-preview-empty svg { width: 22px; height: 22px; stroke: currentColor; }
.form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 17px; }
.form-field{min-width:0}
.form-field--full { grid-column: 1 / -1; }
.personal-question { min-width: 0; }
.personal-question select { min-height: 52px; text-overflow: ellipsis; }
.form-field input, .form-field textarea, .form-field select { width: 100%; padding: 14px 15px; border: 1px solid #d9ced1; border-radius: 12px; outline: none; font: 14px var(--sans); resize: vertical; background: white; }
.form-field input:focus, .form-field textarea:focus, .form-field select:focus { border-color: var(--primary); box-shadow: 0 0 0 4px rgba(167,85,101,.12); }
.errorlist { margin: 5px 0 0; padding: 0; color: var(--primary-dark); font-size: 12px; list-style: none; }
.personal-submit { width: 100%; border: 0; cursor: pointer; }
.billing-fields{margin-top:24px;padding-top:24px;border-top:1px solid #eadfe1}.billing-fields h2{margin:0 0 5px;font:28px/1.1 var(--serif)}.billing-fields>p{margin:0 0 20px;color:var(--muted);font-size:13px;line-height:1.5}.cep-status{display:block;min-height:18px;margin-top:5px;color:var(--muted);font-size:12px}.cep-status[data-state="success"]{color:#28643f}.cep-status[data-state="error"]{color:#8f2438}.cep-status[data-state="loading"]{color:var(--primary)}
.connection-field{margin:0;padding:18px;border:1px solid #e1d5d7;border-radius:14px}
.connection-field legend{padding:0 6px;font-size:13px;font-weight:700}
.connection-field ul{display:flex;flex-wrap:wrap;gap:10px 20px;margin:14px 0 0;padding:0;list-style:none}
.connection-field label{display:flex;align-items:center;gap:7px;margin:0;font-weight:500}
.connection-field input{width:auto}

@media (max-width: 850px), (max-width: 1024px) and (orientation: portrait) {
    .personal-page { background: var(--background); }
    .personal-layout { grid-template-columns: 1fr; max-width: 650px; }
    .personal-intro h1 { font-size: 46px; }
}
@media (max-width: 520px), (max-width: 1024px) and (orientation: portrait) {
    .personal-page { padding: 45px 0 65px; }
    .personal-card { padding: 25px 18px; }
    .photo-field { grid-template-columns: 82px 1fr; }
    .photo-preview { width: 82px; }
    .form-grid { grid-template-columns: 1fr; }
    .form-field--full { grid-column: auto; }
}
@media (max-width: 720px), (max-width: 1024px) and (orientation: portrait) {
    .personal-question { grid-column: 1 / -1; }
}
@media (max-width: 760px), (max-width: 1024px) and (orientation: portrait) {
    .personal-page { min-height: calc(100dvh - 84px); }
    .personal-layout > *, .personal-form { min-width: 0; }
    .personal-page select { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
    .form-field select,
    .form-field textarea {
        font-size: 16px;
    }
}
.progressive-fields{margin-top:18px;padding:14px;border:1px solid #eadfe1;border-radius:14px}.progressive-fields summary{cursor:pointer;color:var(--primary-dark);font-weight:800}.progressive-fields[open] summary{margin-bottom:18px}
.reading-photos-field{display:grid;gap:14px;padding:22px;border:1px solid #eadfe1;border-radius:18px;background:#fffdf9}.reading-photos-field h2{margin:0;font:28px/1.1 var(--serif)}.reading-photos-field p{margin:0;color:var(--muted);font-size:13px;line-height:1.55}.reading-photos-field>small{color:var(--muted);font-size:11px;line-height:1.5}.reading-photo-slots{display:grid;grid-template-columns:repeat(2,minmax(0,280px));gap:24px;align-items:start}.reading-photo-slot{display:grid;min-width:0;gap:7px;justify-items:start}.reading-photo-preview{display:grid;width:100%;max-width:280px;aspect-ratio:4/5;place-items:center;overflow:hidden;border:1px dashed #d8bdc3;border-radius:14px;color:var(--primary);background:#f8eff1;cursor:pointer;transition:border-color .15s,background .15s}.reading-photo-preview img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;background:#f4edef}.reading-photo-add{justify-self:start;padding:10px 16px;border:1px solid var(--primary);border-radius:999px;color:var(--primary-dark);background:#fff;cursor:pointer;font-weight:800}.reading-photo-delete{display:flex;align-items:center;gap:7px;color:var(--primary-dark);font-size:12px;font-weight:700}.reading-photo-delete input{width:auto}@media (max-width: 620px), (max-width: 1024px) and (orientation: portrait){.reading-photo-slots{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.reading-photo-preview{max-width:220px}}@media(max-width:390px){.reading-photo-slots{grid-template-columns:1fr}.reading-photo-preview{max-width:210px}}

.photo-upload-error[hidden]{display:none}.photo-upload-error{display:grid;gap:8px;max-width:100%;margin:10px 0;padding:16px;border:1px solid #c85d70;border-radius:14px;background:#fff3f5;color:#7c2338;overflow-wrap:anywhere}.photo-upload-error svg{width:48px;height:48px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.photo-upload-error span{font-size:14px;line-height:1.5}.photo-upload-error button{min-height:44px;border:0;border-radius:10px;padding:10px 14px;background:#8f3448;color:#fff;font:inherit;cursor:pointer}
.photo-upload-notification[hidden]{display:none}
.photo-upload-notification{position:fixed;z-index:1000;bottom:calc(16px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);box-sizing:border-box;width:min(440px,calc(100% - 24px));max-height:70vh;overflow:auto;padding:18px;border:1px solid #c85d70;border-radius:16px;background:#fff3f5;color:#7c2338;box-shadow:0 8px 32px #0003;overflow-wrap:anywhere}
.photo-upload-notification p{margin:8px 0 14px;font-size:14px;line-height:1.5}
.photo-upload-notification button{min-height:44px;margin:4px 8px 0 0;padding:10px 14px;border:0;border-radius:10px;background:#8f3448;color:#fff;font:inherit;cursor:pointer}
.photo-upload-notification [data-dismiss]{background:transparent;color:#7c2338;text-decoration:underline}

.profile-validation-summary { padding: 18px 20px; margin-bottom: 20px; border: 1px solid #e3bfc7; border-radius: 14px; background: #fff4f5; color: #7a293e; font-size: 14px; line-height: 1.6; }
.profile-validation-summary strong { display: block; font-size: 16px; }
.profile-validation-summary p { margin: 4px 0 8px; }
.profile-validation-summary ul { margin: 0; padding-left: 20px; }
.terms-consent { display: flex; align-items: flex-start; gap: 12px; margin: 8px 0 20px; padding: 16px; border: 1px solid #e3d8da; border-radius: 14px; background: #fff; font-size: 14px; line-height: 1.5; cursor: pointer; }
.terms-consent input { flex: none; width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--primary-dark); }
.terms-consent a { color: var(--primary-dark); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.terms-consent:has(input:checked) { border-color: var(--primary-dark); background: var(--rose-tint); }

/* Required photo missing at save (profile-photo-guard.js): same look as .photo-upload-error. */
.photo-missing[hidden],.photo-missing [hidden]{display:none}
.photo-missing{display:grid;gap:8px;max-width:100%;margin:10px 0;padding:16px;border:1px solid #c85d70;border-radius:14px;background:#fff3f5;color:#7c2338;overflow-wrap:anywhere}
.photo-missing:focus{outline:none}.photo-missing:focus-visible{outline:2px solid #8f3448;outline-offset:2px}
.photo-missing span{font-size:14px;line-height:1.5}
.photo-missing button{min-height:44px;border:0;border-radius:10px;padding:10px 14px;background:#8f3448;color:#fff;font:inherit;font-weight:700;cursor:pointer}
.photo-missing-inapp{margin:4px 0 0;font-size:13px;line-height:1.5;color:#5c2030}
.photo-missing-inapp a{display:flex;align-items:center;justify-content:center;min-height:44px;margin:4px 0;color:#8f3448;font-weight:800;text-decoration:underline}