/* Phone proportions reference Apple's iPhone 17 Pro Max: 78 x 163.4 mm. */
.owner-portal-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);max-width:1120px}
.owner-visibility-intro{max-width:440px}
.owner-phone-tour{width:320px;max-width:100%;justify-self:center;overflow:visible;border:0;border-radius:0;background:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.owner-phone-tour .portal-tour-bar{padding:0 2px 14px;border:0;border-radius:0;gap:8px}
.owner-phone-tour .portal-tour-bar>p{font-size:10px;letter-spacing:.7px;gap:5px}
.owner-phone-tour .portal-platform{font-size:9px}
.owner-phone-tour .portal-motion-label{font-size:10px;gap:4px}
.owner-phone-tour .portal-motion-label>span{font-size:14px}
.owner-phone{position:relative;width:100%;aspect-ratio:78/163.4;isolation:isolate;container:owner-phone/inline-size;border:1px solid #d8dce1;border-radius:49px;background:linear-gradient(110deg,#d2d7dd 0%,#fafbfc 2%,#8e959e 3.2%,#f2f4f6 5%,#a9afb7 50%,#f8fafc 94%,#777f8b 97%,#e6eaf0 99%);box-shadow:0 28px 60px #00000050,0 5px 13px #00000040,inset 0 0 0 2px #c4cad0,inset 0 0 0 4px #ffffff60}
.owner-phone:after{content:'';position:absolute;inset:4px;border-radius:45px;border:1px solid #272b30;box-shadow:inset 0 1px 1px #fff7;pointer-events:none;z-index:3}
.phone-screen{position:absolute;inset:7px;display:grid;grid-template-rows:40px 42px minmax(0,1fr) 46px 16px;overflow:hidden;border:3px solid #111214;border-radius:42px;background:#f3f5f8;color:#15243d;font-family:-apple-system,BlinkMacSystemFont,'Work Sans',sans-serif}
.phone-hardware{position:absolute;background:linear-gradient(90deg,#7c838c,#e7ebef,#a9b0b8);border:1px solid #c0c6cd;border-radius:3px;width:3px;z-index:-1}
.phone-action{left:-4px;top:88px;height:20px}
.phone-volume-up{left:-4px;top:125px;height:39px}
.phone-volume-down{left:-4px;top:177px;height:39px}
.phone-power{right:-4px;top:140px;height:60px}
.phone-camera-control{right:-4px;bottom:154px;height:39px}
.phone-status{position:relative;display:flex;align-items:center;justify-content:space-between;padding:0 19px 0 23px;font-size:12px;font-weight:600;line-height:1;color:#11151b;user-select:none}
.phone-time{padding-top:1px}
.phone-island{position:absolute;left:50%;top:9px;transform:translateX(-50%);width:91px;height:25px;border-radius:16px;background:#08090b;box-shadow:inset 0 0 0 1px #000}
.phone-island:after{content:'';position:absolute;right:9px;top:8px;width:8px;height:8px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#29314e,#111a30 45%,#06080d 70%);box-shadow:0 0 0 2px #0b0d11}
.phone-status-icons{display:flex;align-items:center;gap:4px;padding-top:1px}
.phone-status-icons svg{display:block;width:13px;height:11px}
.phone-status-icons .phone-battery{width:22px}
.phone-app-header{display:flex;align-items:center;justify-content:space-between;padding:0 17px;border-bottom:1px solid #15243d0d;background:#f3f5f8}
.phone-app-header>div{display:grid;gap:2px}
.phone-app-header img{width:91px;height:21px;object-fit:contain;object-position:left}
.phone-app-header>div>span{font-size:8px;line-height:1.3;letter-spacing:1.1px;color:#6b7381}
.phone-avatar{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#e2e7ee;border:1px solid #d5dce6;color:#52617a;font-size:9px;line-height:1;font-weight:500}
.owner-phone .portal-tour-layout{min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:auto;scrollbar-width:none;padding:7px 10px 0}
.owner-phone .portal-tour-layout::-webkit-scrollbar{display:none}
.owner-phone .portal-screens{min-width:0}
.owner-phone .portal-scene figcaption{min-height:70px;padding:0 3px 10px;display:block}
.owner-phone .portal-scene figcaption h3{font-family:inherit;font-size:20px;line-height:1.2;letter-spacing:-.5px;font-weight:600;color:#12233e}
.owner-phone-tour .owner-phone .portal-scene figcaption p{font-size:11px;line-height:1.45;color:#697487;margin-top:5px}
.owner-phone .portal-screen-viewport{border:1px solid #e3e7ee;border-radius:12px;background:white}
.owner-phone .portal-demo-sheet{min-height:400px;padding:12px;background:#fff;font-family:inherit}
.owner-phone .demo-calendar-heading h4{font-family:inherit;font-size:16px}
.owner-phone .demo-screen-eyebrow{font-size:9px}
.owner-phone .demo-occupancy strong{font-size:28px}
.owner-phone .demo-occupancy>span{font-size:10px}
.owner-phone .demo-booking-totals{font-size:10px}
.owner-phone .demo-calendar>span{height:28px}
.owner-phone .demo-calendar .demo-weekday{height:18px}
.owner-phone .demo-calendar-foot,.owner-phone .demo-statement-note{font-size:10px}
.owner-phone .demo-finance-heading h4{font-family:inherit;font-size:14px}
.owner-phone .demo-finance-heading>span{font-size:9px}
.owner-phone .demo-finance-overview{gap:12px;margin:14px 0}
.owner-phone .demo-net strong{font-size:26px;gap:4px}
.owner-phone .demo-net>span{font-size:10px}
.owner-phone .demo-net .demo-net-change{font-size:9px}
.owner-phone .demo-income-bars{gap:7px}
.owner-phone .demo-statement-table{font-size:11px}
.owner-phone .demo-statement-table th,.owner-phone .demo-statement-table td{padding-block:5px}
.owner-phone .demo-stay-photo{height:148px}
.owner-phone .demo-stay-dates{gap:8px;margin-top:14px}
.owner-phone .demo-stay-dates strong{font-size:15px}
.owner-phone .demo-reserved{padding:9px;gap:8px}
.phone-app-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;align-items:center;padding:4px 10px 0;border-top:1px solid #dfe4ed;background:#f6f8fb}
.phone-app-nav[hidden]{display:none}
.phone-app-nav button{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;min-width:0;height:42px;margin:0;padding:4px;border:0;border-radius:10px;background:transparent;color:#8992a1;font-size:9px;line-height:1.1}
.phone-app-nav button[aria-pressed=true]{background:#e6ebf3;color:#122b4e}
.phone-app-nav button:hover{background:#e9edf4;color:#122b4e}
.phone-nav-icon{display:block;width:18px;height:18px}
.phone-home-area{display:flex;align-items:center;justify-content:center;background:#f6f8fb}
.phone-home-area>span{display:block;width:105px;height:4px;border-radius:4px;background:#172234}
.owner-phone :is(button,[role=tabpanel]):focus-visible{outline:2px solid #233e65;outline-offset:-2px}
.owner-phone-tour .portal-tour-footer{padding:15px 6px 0;margin:0;border:0}
.owner-phone-tour .portal-timeline>span{height:2px}
.owner-phone-tour .portal-scene-count{font-size:10px}
@media(max-width:900px){.owner-portal-grid{display:block;max-width:620px}.owner-visibility-intro{max-width:none}.owner-phone-tour{margin:22px auto 0}}
@media(max-width:600px){.owner-phone-tour{width:310px;margin-top:18px}.owner-phone-tour .portal-tour-bar{padding-bottom:12px}}
@container owner-phone (max-width:290px){
 .phone-screen{grid-template-rows:38px 38px minmax(0,1fr) 44px 14px;border-radius:38px}
 .phone-status{padding:0 13px 0 19px;font-size:11px}
 .phone-island{top:8px;width:80px;height:23px}
 .phone-island:after{top:7px}
 .phone-status-icons{gap:3px}
 .phone-status-icons svg{width:11px}
 .phone-status-icons .phone-battery{width:19px}
 .phone-app-header{padding-inline:13px}
 .phone-app-header img{width:83px;height:19px}
 .phone-avatar{width:24px;height:24px}
 .owner-phone .portal-tour-layout{padding:7px 8px 0}
 .owner-phone .portal-scene figcaption{min-height:65px;padding-bottom:8px}
 .owner-phone .portal-scene figcaption h3{font-size:18px}
 .owner-phone-tour .owner-phone .portal-scene figcaption p{font-size:10px;line-height:1.4;margin-top:4px}
 .owner-phone .portal-demo-sheet{padding:10px;min-height:338px}
 .owner-phone .demo-calendar-heading h4{font-size:14px}
 .owner-phone .demo-occupancy strong{font-size:24px}
 .owner-phone .demo-screen-eyebrow{font-size:8px}
 .owner-phone .demo-booking-totals{font-size:9px;margin-bottom:10px}
 .owner-phone .demo-calendar{gap:3px}
 .owner-phone .demo-calendar>span{height:24px;font-size:11px}
 .owner-phone .demo-calendar .demo-weekday{height:16px;font-size:9px}
 .owner-phone .demo-calendar-foot,.owner-phone .demo-statement-note{display:none}
 .owner-phone .demo-finance-heading{padding-bottom:8px}
 .owner-phone .demo-finance-heading h4{font-size:12px}
 .owner-phone .demo-finance-heading>span{font-size:8px}
 .owner-phone .demo-finance-overview{gap:9px;margin:10px 0}
 .owner-phone .demo-net strong{font-size:23px;gap:3px}
 .owner-phone .demo-net strong small{font-size:9px}
 .owner-phone .demo-net .demo-net-change{font-size:8px}
 .owner-phone .demo-payout-chart>p{font-size:9px}
 .owner-phone .demo-bar-track{height:47px}
 .owner-phone .demo-income-bars{gap:5px}
 .owner-phone .demo-income-bars>div>span:last-child{font-size:9px}
 .owner-phone .demo-statement-table{font-size:10px}
 .owner-phone .demo-statement-table th,.owner-phone .demo-statement-table td{padding-block:5px}
 .owner-phone .demo-statement-table caption{font-size:10px}
 .owner-phone .demo-stay-photo{height:126px}
 .owner-phone .demo-stay-photo strong{font-size:17px}
 .owner-phone .demo-stay-dates{margin-top:12px;padding-bottom:10px}
 .owner-phone .demo-stay-dates strong{font-size:14px}
 .owner-phone .demo-stay-dates small{display:none}
 .owner-phone .demo-stay-details{margin-top:8px}
 .owner-phone .demo-reserved{margin-top:10px;padding:8px;gap:6px}
 .owner-phone .demo-reserved strong{font-size:11px}
 .owner-phone .demo-reserved div>span{font-size:9px}
 .phone-app-nav{padding:2px 8px 0}
 .phone-app-nav button{height:40px;font-size:8px}
 .phone-nav-icon{width:17px;height:17px}
 .phone-home-area>span{height:3px;width:90px}
}
