/* Photo controls and exact artwork overlays; imagery outside these frames stays intact. */
.sk-hero-artwork>.spp-hero-layer {position:absolute;inset:0;z-index:4;pointer-events:none;}
.spp-hero-layer [data-profile-photo] {position:absolute;display:block;max-width:none;margin:0;padding:0;border:0;object-fit:cover;object-position:center;pointer-events:none;}
.spp-hero-layer [data-profile-photo][hidden] {display:none;}
.spp-hero-layer .spp-hero-avatar {border-radius:50%;outline:1px solid #fff9;}
.spp-hero-layer .spp-hero-edit {
 position:absolute;box-sizing:border-box;display:flex;justify-content:center;align-items:center;min-width:0;min-height:0;
 margin:0;padding:1px 4px;border:1px solid #f8fbffd9;border-radius:999px;background:#c8b5a1;color:#172e3e;
 font:700 12px/1.2 system-ui,sans-serif;white-space:nowrap;text-shadow:none;box-shadow:0 0 0 1px #556b7130;pointer-events:auto;cursor:pointer;
}
.spp-hero-layer .spp-hero-edit::before {content:'';position:absolute;inset:-10px;min-height:44px;min-width:44px;border-radius:12px;background:transparent;}
.spp-hero-layer .spp-hero-edit::after {content:none;}
.spp-hero-layer .spp-hero-edit[hidden] {display:none;}
.spp-hero-layer .spp-hero-edit:focus-visible {outline:3px solid #00bfd3;outline-offset:4px;}
.spp-dialog {
 box-sizing:border-box;width:min(700px,calc(100vw - 24px));max-height:calc(100dvh - 32px);padding:24px;
 overflow:auto;border:1px solid #a1b7c6;border-radius:20px;background:#f7fafc;color:#173449;
 font:15px/1.5 Nunito,system-ui,sans-serif;text-align:left;text-shadow:none;box-shadow:0 18px 65px #102d4666;
}
.spp-dialog::backdrop {background:#102236bb;}
.spp-dialog * {box-sizing:border-box;}
.spp-dialog form {margin:0;}
.spp-dialog header {display:flex;justify-content:space-between;align-items:center;gap:16px;}
.spp-dialog .spp-kicker {margin:0;color:#527184;font-size:10px;font-weight:800;letter-spacing:.14em;}
.spp-dialog h2 {margin:3px 0 0;color:#173449;font-size:28px;line-height:1.2;letter-spacing:-.025em;}
.spp-dialog .spp-storage {margin:16px 0 20px;padding:10px 12px;border:1px solid #b8d7d3;border-radius:10px;background:#eaf6f2;color:#2b5c55;font-size:13px;}
.spp-dialog .spp-previews {display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:22px;}
.spp-dialog .spp-field {min-width:0;}
.spp-dialog .spp-preview {position:relative;display:flex;justify-content:center;align-items:center;overflow:hidden;max-width:100%;height:165px;margin-bottom:14px;border:1px solid #aabfc9;background:#e3edf1;color:#456276;}
.spp-dialog .spp-preview-avatar {width:165px;border-radius:50%;}
.spp-dialog .spp-preview-cover {width:100%;border-radius:10px;}
.spp-dialog .spp-preview>img {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;}
.spp-dialog .spp-preview>img[hidden] {display:none;}
.spp-dialog label {display:block;margin-bottom:7px;color:#173449;font-size:13px;font-weight:800;}
.spp-dialog input[type="file"] {display:block;width:100%;min-height:44px;padding:7px;border:1px solid #a1b7c6;border-radius:9px;background:#fff;color:#294659;font:12px/1.5 system-ui,sans-serif;}
.spp-dialog input[type="file"]::file-selector-button {min-height:30px;margin-right:8px;padding:5px 9px;border:1px solid #bdd0d8;border-radius:6px;background:#edf4f6;color:#1f4d61;cursor:pointer;}
.spp-dialog .spp-hint {margin:16px 0 8px;color:#5b7180;font-size:12px;}
.spp-dialog [data-photo-error] {margin:8px 0;color:#a22035;font-size:13px;font-weight:700;}
.spp-dialog [data-photo-status] {margin:8px 0;color:#23645b;font-size:13px;}
.spp-dialog :is([data-photo-error],[data-photo-status]):empty {display:none;}
.spp-dialog footer {display:flex;justify-content:flex-end;gap:10px;margin-top:20px;padding-top:16px;border-top:1px solid #cedde3;}
.spp-dialog button {min-height:44px;padding:10px 18px;border:1px solid #a1b7c6;border-radius:10px;background:#fff;color:#24495c;font:800 14px/1.4 Nunito,system-ui,sans-serif;cursor:pointer;text-shadow:none;box-shadow:none;}
.spp-dialog .spp-close {width:44px;height:44px;flex:none;margin:0;padding:0;font-size:26px;line-height:1;}
.spp-dialog .spp-save {background:#006b68;border-color:#006b68;color:#fff;}
.spp-dialog button:disabled {opacity:.55;cursor:default;}
.spp-dialog :is(button,input):focus-visible {outline:3px solid #008cba;outline-offset:3px;}
.spp-room-photo-host {position:relative;overflow:hidden;}
.spp-room-avatar {position:absolute;inset:0;z-index:1;width:100%;height:100%;border-radius:inherit;object-fit:cover;}
.spp-room-cover {position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;}
@media(max-width:560px) {
 .spp-dialog {padding:20px 16px;border-radius:16px;}
 .spp-dialog .spp-previews {grid-template-columns:minmax(0,1fr);gap:22px;}
 .spp-dialog .spp-preview-avatar {width:142px;height:142px;}
 .spp-dialog .spp-preview-cover {height:155px;}
 .spp-dialog input[type="file"] {font-size:14px;}
 .spp-dialog footer>button {flex:1;padding-inline:12px;}
}
@media(forced-colors:active) {
 .spp-dialog,.spp-dialog :is(button,input,.spp-storage,.spp-preview),.spp-hero-layer .spp-hero-edit {background:Canvas;color:CanvasText;border-color:CanvasText;box-shadow:none;}
 .spp-dialog :is(button,input):focus-visible,.spp-hero-layer .spp-hero-edit:focus-visible {outline-color:Highlight;}
}

/* Keep the measured photo-edit hit target while presenting the same glass symbol. */
.spp-hero-layer .spp-hero-edit:has(>.sota-glass-mark) {padding:0;border:0;background:transparent;box-shadow:none;}
.spp-hero-layer .spp-hero-edit>.sota-glass-mark[data-sota-mark] {width:44px;height:44px;min-width:44px;min-height:44px;max-width:44px;max-height:44px;--sota-action-tint:#b789f1;flex:none;}

/* This opaque action replaces the printed button and ellipsis, not just its text. */
.spp-hero-layer .spp-hero-edit:has(>.sota-glass-mark){gap:10px;min-height:44px;padding:5px 10px;border:1px solid #ffffffd9;border-radius:14px;background:#f7eee4;color:#26394c;box-shadow:0 2px 8px #172b4533;white-space:normal;}
.spp-hero-layer .spp-hero-edit::before{inset:0;min-height:0;min-width:0;}
.spp-hero-edit .spp-edit-caption{font:800 14px/1.2 Nunito,system-ui,sans-serif;text-align:left;}
.spp-hero-layer[data-photo-layout=mobile] .spp-hero-edit:has(>.sota-glass-mark){gap:5px;padding:3px 5px;border-radius:12px;}
.spp-hero-layer[data-photo-layout=mobile] .spp-hero-edit>.sota-glass-mark[data-sota-mark]{width:32px;height:32px;min-width:32px;min-height:32px;max-width:32px;max-height:32px;}
.spp-hero-layer[data-photo-layout=mobile] .spp-edit-caption{font-size:11px;}
@media(forced-colors:active){.spp-hero-layer .spp-hero-edit:has(>.sota-glass-mark){background:ButtonFace;color:ButtonText;border-color:ButtonText;}}