/* The real portal checklist and Report a problem form (cleaning-portal.js). */
[data-scene="cleaning"] .gph-win{position:relative}
.cp{position:absolute;inset:0;z-index:30;background:#f7f8fa;color:#172033;font-size:14px;line-height:1.4;overflow:hidden}
.cp[hidden]{display:none}
.cp svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
.cp-list{position:absolute;inset:0;display:flex;flex-direction:column;padding:12px 0 0}
.cp-back{align-self:flex-start;padding:4px 12px;border:1px solid #e4e7ee;border-radius:8px;background:#fff;font-size:12px}
.cp-bar{margin-top:16px;height:8px;border-radius:8px;background:#e4e7f6;overflow:hidden}
.cp-bar i{display:block;height:100%;width:50%;border-radius:8px;background:#4945ec;transition:width .5s}
.cp.sec2 .cp-bar i{width:100%}
.cp-step{margin-top:4px;font-size:12px;color:#667085}
.cp-scroll{flex:1;min-height:0;margin-top:12px;overflow:hidden}
.cp-track{transition:translate .6s cubic-bezier(.3,.7,.2,1),opacity .3s}
.cp-card{background:#fff;border:1px solid #e4e7ee;border-radius:12px;padding:16px}
.cp-card>b{font-size:20px;font-weight:600}
.cp-card>p{margin:4px 0 0;font-size:13px;color:#667085}
.cp-card h5{margin:16px 0 12px;font-size:16px;font-weight:600}
.cp-card>div{display:grid;gap:12px}
.cp .cp-s2,.cp.sec2 .cp-s1{display:none}
.cp.sec2 h5.cp-s2{display:block}.cp.sec2 div.cp-s2{display:grid}
.cp-item{position:relative;display:flex;align-items:flex-start;gap:12px;padding:16px;border:1px solid #e4e7ee;border-radius:12px;background:#fff;transition:background .3s,border-color .3s}
.cp-txt{flex:1;display:grid;gap:4px}
.cp-txt b{font-size:15px;font-weight:600}
.cp-txt u{text-decoration:none;font-size:13px;color:#667085}
.cp-txt small{margin-top:8px;font-size:12px;color:#667085}
.cp-file{display:flex;flex-wrap:wrap;row-gap:6px;align-items:center;gap:12px;font-size:12px;color:#667085}
.cp-file em{flex:none;white-space:nowrap;display:inline-flex;align-items:center;gap:4px;font-style:normal;padding:4px 12px;border:1px solid #d0d5dd;border-radius:8px;color:#344054;background:#fff;transition:scale .2s,background .2s}
.cp-yn{display:flex;gap:8px}
.cp-yn>span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;color:#fff;transition:scale .2s,box-shadow .2s}
.cp-yn .no{background:#e0457b}.cp-yn .yes{background:#1f9d6b}
.cp-flag,.cp-acts{display:none}
.cp-item.tap-file .cp-file em{scale:.94;background:#eeedff;box-shadow:0 0 0 4px #4945ec33}
.cp-item.tap-yes .yes,.cp-item.tap-no .no{scale:.88;box-shadow:0 0 0 6px #4945ec33}
.cp-item.is-done{background:#effaf4;border-color:#9fdcbc}
.cp-item.is-done .no{opacity:.35}
.cp-item.is-reported{background:#fff1f4;border-color:#f3b4c6}
.cp-item.is-reported .cp-yn{display:none}
.cp-item.is-reported .cp-flag{display:block;margin-top:8px}
.cp-flag i{font-style:normal;font-size:12px;padding:4px 8px;border-radius:12px;background:#fde0e8;color:#c0265c}
.cp-item.is-reported .cp-acts{display:flex;gap:8px}
.cp-acts em{font-style:normal;font-size:12px;padding:4px 8px;border:1px solid #e4e7ee;border-radius:12px;background:#fff}
.cp-acts em+em{color:#c0265c;border-color:#f3b4c6}
.cp-item.is-ring{box-shadow:0 0 0 4px #e0457b33}
.cp-list>footer{display:flex;justify-content:flex-end;gap:12px;padding:12px 0 8px}
.cp-list>footer>span{display:inline-flex;align-items:center;gap:4px;padding:8px 16px;border-radius:8px;font-size:13px;transition:scale .2s}
.cp-next,.cp-submit{background:#4945ec;color:#fff}
.cp-prev{margin-right:auto;border:1px solid #e4e7ee;background:#fff}
.cp:not(.sec2) :is(.cp-prev,.cp-submit),.cp.sec2 .cp-next{display:none!important}
.cp.tap-next .cp-next{scale:.94;box-shadow:0 0 0 4px #4945ec33}
/* Report a problem: the portal's own modal over the list. */
.cp-form{position:absolute;inset:0;background:#10182866;padding:12px 0;opacity:0;visibility:hidden;transition:opacity .35s ease,visibility .35s}
.cp.form-open .cp-form{opacity:1;visibility:visible}
.cp-sheet{translate:0 32px;transition:translate .45s cubic-bezier(.2,.8,.2,1)}
.cp.form-open .cp-sheet{translate:0 0}
.cp-sheet{position:absolute;inset:0;display:flex;flex-direction:column;background:#fff;border-radius:0;overflow:hidden}
.cp-fscroll{flex:1;min-height:0;display:flex;flex-direction:column;gap:4px;padding:20px 16px;transition:translate .6s cubic-bezier(.3,.7,.2,1)}
.cp-fscroll h4{margin:0;font-size:18px;font-weight:600}
.cp-sub{margin:0 0 12px;font-size:12px;color:#667085}
.cp-fscroll label{margin-top:12px;font-size:13px;font-weight:500}
.cp-src{display:grid;gap:8px}
.cp-src>span{display:flex;align-items:center;gap:8px;padding:12px;border-radius:8px;background:#f2f4f7;font-size:13px;transition:scale .2s}
.cp-src>span.is-tap{scale:.97;box-shadow:0 0 0 4px #4945ec33}
.cp-up{display:none;align-items:center;gap:12px;padding:8px 0}
.cp-up.is-on{display:flex}
@keyframes cp-in{from{opacity:0;translate:0 8px}}
.cp-src:has(+.cp-up.is-on){display:none}
.cp-thumb{width:40px;height:40px;border-radius:6px;background:#ddd url(../../img/cleaning-ceiling-leak.webp) center/cover}
.cp-up b{display:block;font-size:13px;font-weight:500}.cp-up small{font-size:12px;color:#667085}
.cp-up.is-loading .cp-thumb{opacity:.4}
.cp-in{display:flex;align-items:center;min-height:40px;padding:8px 12px;border:1px solid #d0d5dd;border-radius:8px;font-size:13px;transition:border-color .2s,box-shadow .2s}
.cp-in.is-ph{color:#98a2b3}
.cp-in.is-focus{border-color:#4945ec;box-shadow:0 0 0 4px #4945ec22}
.cp-in.is-focus:not(.cp-sel)::after{content:"";width:1px;height:16px;margin-left:1px;background:#172033;animation:cp-caret 1s steps(1) infinite}
@keyframes cp-caret{50%{opacity:0}}
.cp-sel{justify-content:space-between}
.cp-sel::after{content:"⌄";color:#667085}
.cp-area{align-items:flex-start;min-height:72px}
.cp-chip{font-style:normal;font-size:12px;padding:2px 8px;border-radius:12px;background:#fde0e8;color:#c0265c}
.cp-menu{display:flex;max-height:0;opacity:0;overflow:hidden;border-color:transparent!important;margin-top:0;transition:max-height .4s cubic-bezier(.2,.8,.2,1),opacity .25s,margin .3s;flex-direction:column;padding:0 4px;border:1px solid #e4e7ee;border-radius:8px;background:#fff;box-shadow:0 12px 24px -8px #17203333}
.cp-menu.is-open{max-height:360px;opacity:1;margin-top:4px;border-color:#e4e7ee!important}
.cp-menu span{padding:8px 12px;border-radius:6px;font-size:13px;transition:background .2s}
.cp-menu span.is-hover{background:#eeedff;color:#4945ec;font-weight:500}
.cp-sheet>footer{position:relative;z-index:1;flex:none;display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-top:1px solid #edf0f5;background:#fff}
.cp-save{padding:8px 16px;border-radius:8px;background:#4945ec;color:#fff;font-size:13px;transition:scale .2s,opacity .2s}
.cp-save.is-tap{scale:.94}
.cp-save.is-saving{opacity:.5}
.cp-save.is-saving::before{content:"↻ "}
/* The phone camera, as the portal opens it. */
/* Full screen, over the status bar and the Base360 bar, as a phone camera is. */
.cp-cam{position:absolute;inset:0;z-index:60;border-radius:inherit;overflow:hidden;background:#000;color:#fff;opacity:0;visibility:hidden;scale:1.04;transition:opacity .3s ease,visibility .3s,scale .4s cubic-bezier(.2,.8,.2,1)}
.cp-cam.is-on{opacity:1;visibility:visible;scale:1}
.cp-cam.is-flash .cp-view{filter:brightness(1.8)}
.cp-view{transition:filter .15s}
.cp-view{position:absolute;inset:0 0 176px;background:#1c1c1e center/cover no-repeat}
.cp-view[data-shot="entrance"]{background-image:url(../../img/cleaning-entrance-check.webp)}
.cp-view[data-shot="leak"]{background-image:url(../../img/cleaning-ceiling-leak.webp)}
.cp-view[data-shot="hall"]{background-image:url(../../img/cleaning-hallway-check.webp)}
.cp-zoom{position:absolute;left:0;right:0;bottom:120px;text-align:center;font-size:12px}
.cp-zoom b{color:#ffd60a}
.cp-shutter{position:absolute;left:50%;bottom:40px;width:64px;height:64px;margin-left:-32px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px #000,0 0 0 7px #fff;transition:scale .15s}
.cp-shutter.is-press{scale:.85}
.cp-cam em{position:absolute;left:0;right:0;bottom:12px;text-align:center;font-style:normal;font-size:12px;color:#ffd60a;letter-spacing:.08em}
.cp-item,.cp-yn>span,.cp-file em,.cp-src>span,.cp-save,.cp-next{transition-timing-function:cubic-bezier(.2,.8,.2,1)!important}
/* The page's attention mark, the linen card's (cleaning-preview.css .linen-mark). */
.cp-item{transition:background .3s,border-color .3s,box-shadow .25s}.ca-box,.ca-img{transition:box-shadow .25s}
:is(.cp-item,.ca-box,.ca-img).cp-mark{box-shadow:0 0 0 2px #fff,0 0 0 3.2px #1e6be8f2,0 0 0 7px #1e6be824}
/* View access details: the portal's lockbox pop-up over the job card (cleaning-portal.js, 240 s). */
.ca{position:absolute;inset:0;z-index:28;display:grid;align-items:start;justify-items:center;padding:12px 0;background:#10182866;color:#172033;font-size:14px;line-height:1.4}
.ca[hidden]{display:none}
.ca svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ca-sheet{width:min(100%,480px);max-height:100%;background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 24px 48px -16px #17203359}
.ca-sheet>header{position:relative;z-index:1;background:#fff;display:flex;justify-content:space-between;gap:12px;padding:16px 16px 12px;border-bottom:1px solid #edf0f5}
.ca-sheet>header b{display:block;font-size:18px;font-weight:600;line-height:1.3}
.ca-sheet>header span{display:flex;gap:8px;margin-top:8px}
.ca-sheet>header i{font-style:normal;font-size:12px;font-weight:500;padding:4px 8px;border-radius:8px;background:#e0ecff;color:#1d4ed8}
.ca-sheet>header i+i{background:#e7f8ee;color:#15803d}
.ca-x{display:grid;place-items:center;width:32px;height:32px;border-radius:8px;transition:scale .2s,background .2s}
.ca-x svg{width:20px;height:20px}
.ca-x.is-tap{scale:.88;background:#f2f4f7;box-shadow:0 0 0 4px #4945ec33}
.ca-body{display:grid;gap:4px;padding:12px 16px 16px}
.ca-body h6{display:flex;align-items:center;gap:8px;margin:8px 0 0;font-size:14px;font-weight:600}.ca-body h6:first-child{margin-top:0}
.ca-box{padding:8px 12px;border:1px solid #e4e7ee;border-radius:12px;background:#fff}
.ca-prop b{display:block;font-weight:400}.ca-prop span{color:#667085}
.ca-ins{line-height:1.4}.ca-ins p{margin:0}
.ca-ins b{font-weight:600}
.ca-code{display:flex;align-items:center;justify-content:space-between}
.ca-code b{font-size:16px;letter-spacing:.08em}
.ca-code span{padding:4px 12px;border:1px solid #e4e7ee;border-radius:8px;font-size:13px}
.ca-img{position:relative;border-radius:12px;overflow:hidden;border:1px solid #e4e7ee}
.ca-img img{display:block;width:100%;height:80px;object-fit:cover}
.ca-img span{position:absolute;top:8px;right:8px;display:grid;place-items:center;width:32px;height:32px;border-radius:8px;background:#1720338c;color:#fff}
.ca-img span svg{width:20px;height:20px}
[data-scene="cleaning"] .cl-access .cl-link{transition:scale .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s}
[data-scene="cleaning"].ca-tap-link .cl-access .cl-link{scale:.97;box-shadow:inset 0 0 0 1px #4945ec,0 0 0 4px #4945ec33}
[data-scene="cleaning"] .cl-top>b{transition:scale .2s cubic-bezier(.2,.8,.2,1)}
[data-scene="cleaning"].ca-tap-start .cl-top>b{scale:.94}
/* ?issue=wine (damage claim article): the wine stain photo instead of the ceiling leak */
[data-issue="wine"] .cp-thumb,[data-issue="wine"] .cp-view[data-shot="leak"]{background-image:url(../../img/cleaning-wine-stain.webp)}
