/* The device is an interactive view of the same offer, not a separate application. */
.worker-perspective{position:fixed;inset:0 0 0 auto;z-index:30;width:420px;padding:20px 22px 12px;background:#eaf0f6;border-left:1px solid #cad4df;box-shadow:-12px 0 32px #10233812;display:flex;flex-direction:column;gap:12px;color:#192b3b}
.perspective-heading{display:flex;align-items:center;gap:12px;justify-content:space-between;flex-shrink:0}.perspective-heading .eyebrow{font-size:.75rem;letter-spacing:.1em;margin-bottom:4px}.perspective-heading h2{font-size:1.12rem;line-height:1.4}.perspective-heading .icon-button{font-size:1.3rem;flex-shrink:0}
.phone-worker-label{display:grid;gap:5px;font-size:.875rem;font-weight:600}.phone-worker-label select{background:#fff;width:100%;border:1px solid #c3cfdc;border-radius:7px;padding:9px 10px;min-height:42px;font-size:.875rem}
.phone-device{border:7px solid #172331;border-radius:36px;background:#fff;box-shadow:0 15px 30px #0d213e1c;overflow:hidden;display:flex;flex-direction:column;min-height:0;flex:1;max-height:800px;isolation:isolate}
.phone-status{display:flex;justify-content:space-between;align-items:center;padding:9px 18px 7px;position:relative;min-height:38px;font-size:.75rem;font-weight:700;flex-shrink:0}.phone-camera{position:absolute;left:50%;transform:translateX(-50%);width:84px;height:21px;background:#172331;border-radius:20px;top:5px}
.phone-tabs{display:flex;gap:4px;padding:5px 10px 9px;flex-shrink:0;border-bottom:1px solid #e1e7ed}.phone-tabs button{flex:1;padding:9px 5px;border-radius:7px;font-size:.875rem;font-weight:650;min-height:40px}.phone-tabs button[aria-pressed=true]{background:#eaf0f7;color:#183959}.phone-tabs span{font-size:.75rem;color:#567088;margin-left:3px}
.phone-contact{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid #e5eaf0;background:#fafbfc;flex-shrink:0;font-size:.95rem}.phone-contact img{border-radius:8px}.phone-contact span{margin-left:auto;color:#687b8e;font-size:.75rem}
.phone-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;flex:1;scrollbar-width:thin}.phone-messages{padding:14px 12px;display:flex;flex-direction:column;gap:15px;background:#fff}.phone-message{width:92%;display:flex;flex-direction:column;gap:5px;font-size:.875rem;line-height:1.55}.phone-message time{font-size:.75rem;color:#6c798a;text-align:center}.phone-message>div{border-radius:17px 17px 17px 4px;padding:12px 14px;background:#edf0f4;overflow-wrap:anywhere;white-space:pre-wrap}.phone-message.from-worker{align-self:flex-end}.phone-message.from-worker>div{background:#21774c;color:white;border-radius:17px 17px 4px 17px}.phone-message small{font-size:.75rem;text-align:right}.phone-message a,.phone-inline-link{color:#225eae;text-decoration:underline;overflow-wrap:anywhere;font:inherit;text-align:left;padding:0;display:inline;white-space:normal}.phone-message.from-worker a{color:white}
.phone-compose{display:flex;align-items:end;gap:8px;padding:10px 12px;border-top:1px solid #e1e7ed;flex-shrink:0;background:#fafbfc}.phone-compose textarea{border:1px solid #c8d3df;border-radius:14px;resize:none;min-width:0;flex:1;padding:10px;font-size:.875rem;line-height:1.4;max-height:110px}.phone-send{border-radius:50%;height:40px;width:40px;background:#21774c;color:white;font-size:1.6rem;flex-shrink:0}
.phone-browser-address{text-align:center;background:#f1f4f7;font-size:.75rem;color:#617387;padding:8px;flex-shrink:0}.phone-offer-label{display:grid;gap:4px;padding:10px 13px;font-size:.75rem;color:#64758a;border-bottom:1px solid #e3e9f0;flex-shrink:0}.phone-offer-label select{font-size:.875rem;padding:8px;width:100%;border:1px solid #cfdae5;border-radius:6px;color:#203a51;background:white}
.phone-reply{padding:20px 17px;background:#fff}.phone-reply-brand{display:flex;align-items:center;gap:9px;font-size:.8rem;letter-spacing:.08em;margin-bottom:20px}.phone-reply .reply-heading h1{font-size:1.4rem}.phone-reply .reply-heading p{font-size:.875rem;line-height:1.6}.phone-reply .reply-shift{padding:15px;margin:19px 0 16px}.phone-reply .reply-shift h2{font-size:1.13rem}.phone-reply .reply-shift dd{font-size:.875rem}.phone-reply .reply-actions{gap:9px}.phone-reply .reply-actions button{min-height:46px;padding:10px 13px;font-size:.9375rem}.phone-reply .reply-small{font-size:.875rem;line-height:1.5}.phone-reply .reply-sms{margin-top:14px}.phone-reply .reply-check{width:37px;height:37px;margin-bottom:13px}
.phone-home{height:20px;flex-shrink:0;position:relative;background:#fff}.phone-home:after{content:'';width:100px;height:4px;position:absolute;bottom:5px;left:50%;transform:translateX(-50%);background:#172331;border-radius:6px}.phone-empty{margin:auto;padding:25px 15px;text-align:center;color:#63758a}.phone-empty h3{font-size:1rem;margin-bottom:10px;color:#29435e}.phone-empty p{font-size:.875rem;line-height:1.6}.phone-admin-link{font-size:.875rem;margin:0 auto;flex-shrink:0;padding:3px 0;line-height:1.5}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.phone-launch{display:inline-flex;align-items:center;gap:8px}.phone-launch svg{width:18px;height:18px}.phone-offer-launch{margin:12px 0;border-color:#a9bed4;background:#f1f6fb;color:#264c71}.demo-workspace-label{font-size:.75rem;color:#aabbcc}
@media(min-width:1280px){body.has-worker-phone .app-shell{margin-right:420px}body.has-worker-phone .workspace{padding:28px 24px}body.has-worker-phone .board{grid-template-columns:minmax(0,1fr)}body.has-worker-phone .board.has-selection .detail-panel{order:-1}body.has-worker-phone .board.has-selection .needs-panel{max-height:450px;overflow:auto}body.has-worker-phone .stats{grid-template-columns:repeat(2,minmax(0,1fr))}body.has-worker-phone .settings-grid{grid-template-columns:1fr}body.has-worker-phone .topbar .today{display:none}body.has-worker-phone .conversations{grid-template-columns:200px minmax(0,1fr)}body.has-worker-phone .conversation-header{flex-wrap:wrap;gap:10px}}
@media(min-width:1920px){body.has-worker-phone .board{grid-template-columns:minmax(320px,1.1fr) minmax(330px,1fr)}body.has-worker-phone .board.has-selection .detail-panel{order:0}body.has-worker-phone .board.has-selection .needs-panel{max-height:none}body.has-worker-phone .stats{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){.worker-perspective{width:min(100%,420px);padding:12px 12px 8px;gap:8px}.phone-device{border-width:5px;border-radius:27px}.phone-worker-label{font-size:.75rem}.phone-worker-label select{min-height:38px;padding:7px}.perspective-heading h2{font-size:1rem}.topbar .phone-launch{font-size:.75rem;padding:6px;min-height:36px}.topbar .today{display:none}.phone-admin-link{font-size:.8rem}}
@media(max-height:650px){.worker-perspective{gap:6px;padding-top:10px}.phone-worker-label{display:none}.phone-device{border-radius:24px}.phone-status{min-height:29px;padding-top:5px}.phone-camera{height:17px}.phone-tabs button{min-height:34px;padding:6px}.phone-contact{padding:8px 12px}.phone-admin-link{font-size:.75rem}}

.conversation-header-actions{display:flex;gap:8px;flex-wrap:wrap}.conversation-header-actions .secondary{font-size:.8rem;padding:9px 12px}

/* A separate page, containing only the worker's phone. */
.phone-page{margin:0;min-height:100dvh;padding:20px;display:grid;place-items:center;background:#eaf0f6}
.phone-page #phone-app{width:100%;display:grid;place-items:center}
.phone-standalone{width:min(100%,390px);height:min(850px,calc(100dvh - 40px));min-height:360px;display:flex}
.phone-standalone .phone-device{width:100%;max-height:none;flex:1}
.phone-owner{text-align:center;font-size:.875rem;font-weight:600;padding:2px 12px 8px;color:#53697e;flex-shrink:0}
.phone-connection-notice{margin:0;padding:10px 13px;background:#fff5df;color:#795117;font-size:.875rem;line-height:1.5;flex-shrink:0}
.phone-connection-notice button{display:block;padding-bottom:0}
.phone-standalone .phone-empty h1{font-size:1.3rem;line-height:1.35;margin-bottom:12px}
.phone-standalone .phone-empty .secondary{margin-top:16px}
@media(max-width:440px){.phone-page{padding:8px}.phone-standalone{height:calc(100dvh - 16px)}.phone-standalone .phone-device{border-width:5px;border-radius:28px}}