/* Load after paper-motion.css. The native phone plate and portrait atlas stay. */
.rh-phone.rh-v4-phone {
  --rh-phone-inset: var(--p-s3);
  --rh-chat-outgoing: #d4edda;
  --rh-chat-on-outgoing: #21432c;
  --rh-app-info: #f3e6b5;
  --rh-app-info-shadow: 1px 3px 3px #51463426;
  --rh-app-copy: 15px;
  --rh-app-meta: 14px;
  --rh-app-name: 22px;
  --rh-app-action: var(--p-s6);
  width: 100%;
  max-width: 340px;
  height: 460px;
  margin-inline: auto;
  position: relative;
  background: url('/assets/paper-phone-v1.3a72bf792de7.webp') center / 100% 100% no-repeat;
  color: var(--ink);
  font-family: var(--font-body);
}

.rh-v4-phone .rh-v4-phone-screen {
  position: absolute;
  top: 16.5%;
  left: 20.5%;
  width: 59%;
  height: 68%;
  font-size: var(--rh-app-copy);
  line-height: 1.3;
}
.rh-v4-phone .rh-v4-phone-owner { position: absolute; top: 3%; left: 5%; width: 90%; font-size: 14px; line-height: 1.3; text-align: center; color: var(--ink-secondary); }

.rh-v4-phone .rh-v4-phone-panel {
  position: absolute;
  top: 38px;
  left: var(--rh-phone-inset);
  width: calc(100% - 2 * var(--rh-phone-inset));
  height: calc(100% - 38px);
  padding: var(--p-s1) 0 var(--p-s8);
}

.rh-v4-phone .rh-v4-phone-panel[hidden],
.rh-v4-phone .rh-v4-phone-presence[hidden] { display: none !important; }

.rh-v4-phone .rh-v4-phone-person {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 4px;
}

.rh-v4-phone .rh-v4-phone-photo { display: block; width: 36px; flex: none; transform: rotate(-3deg); }
.rh-v4-phone .rh-v4-phone-photo .rh-avatar { width: 100%; height: auto; }
.rh-v4-phone .rh-v4-phone-person h3,
.rh-v4-phone .rh-v4-phone-notice-person h3 { margin: 0; font-size: var(--rh-app-name); line-height: 1.15; font-weight: 650; }
.rh-v4-phone .rh-v4-phone-intents { margin: 0; }
.rh-v4-phone .rh-v4-phone-intents > div + div { margin-top: 8px; }
.rh-v4-phone .rh-v4-phone-intents dt { margin-bottom: 4px; font-size: 14px; line-height: 1.25; font-weight: 700; }
.rh-v4-phone .rh-v4-phone-intents dd { margin: 0; font-size: var(--rh-app-copy); line-height: 1.35; text-wrap: pretty; }
.rh-v4-phone .rh-v4-phone-presence { margin-top: 14px; font-size: 14px; line-height: 1.3; color: var(--ink-secondary); }

.rh-v4-phone .rh-v4-phone-notice { display: grid; grid-template-rows: auto minmax(min-content,1fr) auto; gap: var(--p-s3); padding-bottom: var(--p-s1); }
.rh-v4-phone .rh-v4-phone-notice-person { display: flex; align-items: center; gap: var(--p-s2); }
.rh-v4-phone .rh-v4-phone-notice-photo { display: block; width: 45px; flex: none; transform: rotate(2deg); }
.rh-v4-phone .rh-v4-phone-notice-photo .rh-avatar { width: 100%; height: auto; }
.rh-v4-phone .rh-v4-phone-notice-person p { font-size: var(--rh-app-meta); line-height: 1.3; }
.rh-v4-phone .rh-v4-phone-notice-why { font-size: var(--rh-app-copy); line-height: 1.35; font-weight: 500; }
.rh-app-match { position: relative; isolation: isolate; align-self: center; min-width: 0; padding: var(--p-s3); color: var(--ink); filter: drop-shadow(var(--rh-app-info-shadow)); }
.rh-app-match::before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--rh-app-info) url('/assets/concept-paper.80a769ad7741.webp') center / 640px; background-blend-mode: multiply; mask: url('/assets/paper-sheet-v1.3b0e84187080.webp') center / 100% 100% no-repeat; pointer-events: none; }

.rh-v4-phone .rh-v4-phone-chat { padding-inline: 0; }
.rh-v4-phone .rh-v4-phone-chat-header { display: flex; align-items: center; gap: 8px; padding-bottom: 8px; margin-bottom: 8px; }
.rh-v4-phone .rh-v4-phone-chat-photo { display: block; width: 34px; flex: none; }
.rh-v4-phone .rh-v4-phone-chat-photo .rh-avatar { width: 100%; height: auto; }
.rh-v4-phone .rh-v4-phone-chat-header h3 { margin: 0 0 3px; font-size: var(--rh-app-name); line-height: 1.2; font-weight: 650; }
.rh-v4-phone .rh-v4-phone-chat-header p { font-size: var(--rh-app-meta); line-height: 1.3; color: var(--ink-secondary); }
.rh-v4-phone .rh-v4-phone-messages { list-style: none; padding: 0 5px; margin: 0; display: flex; flex-direction: column; gap: 14px; }
.rh-v4-phone .rh-v4-phone-message { position: relative; max-width: 91%; padding: 9px 10px; font-size: var(--rh-app-copy); line-height: 1.3; border-radius: 12px; }
.rh-v4-phone .rh-v4-phone-message p { margin: 0; text-wrap: pretty; }
.rh-v4-phone .rh-v4-phone-message--outgoing { align-self: flex-end; background: var(--rh-chat-outgoing); color: var(--rh-chat-on-outgoing); border-bottom-right-radius: 4px; }
.rh-v4-phone .rh-v4-phone-message--incoming { align-self: flex-start; background: color-mix(in srgb, var(--guide) 18%, var(--paper-raised)); color: var(--ink); border-bottom-left-radius: 4px; }
.rh-v4-phone .rh-v4-phone-message::after { content: ''; position: absolute; bottom: 0; width: 12px; height: 16px; background: inherit; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 16'%3E%3Cpath d='M0 0H5C4 8 7 11 12 14C7 16 3 14 0 11Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
.rh-v4-phone .rh-v4-phone-message--outgoing::after { right: -5px; }
.rh-v4-phone .rh-v4-phone-message--incoming::after { left: -5px; transform: scaleX(-1); }
.rh-v4-phone .rh-v4-phone-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.rh-v4-phone :focus-visible { outline: 3px solid var(--air); outline-offset: 4px; }

.rh-intent-fit {
  width: 100%;
  max-width: 560px;
  margin: 0 auto;
  color: var(--ink);
  font-family: var(--font-body);
}

.rh-intent-fit .rh-intent-rows { display: grid; gap: 12px; }
.rh-fit-opportunity { margin-bottom: var(--p-s6); text-align: center; }
.rh-fit-ticket { width: fit-content; max-width: 100%; margin-inline: auto; padding: var(--p-s3) var(--p-s6); }
.rh-fit-ticket > .rh-pen { font-size: var(--p-s8); }
.rh-fit-location { display: flex; flex-wrap: wrap; justify-content: center; column-gap: var(--p-s3); row-gap: var(--p-s1); margin-top: var(--p-s2); font-size: var(--rh-small); line-height: 1.4; }
.rh-fit-location > span { white-space: nowrap; }
.rh-fit-location > span + span::before { content: '·'; margin-right: var(--p-s3); }
.rh-intent-fit .rh-intent-row { --rh-join-gap: 28px; display: flex; align-items: stretch; isolation: isolate; }
.rh-intent-fit .rh-intent-piece {
  flex: 0 0 54.545455%;
  min-width: 0;
  min-height: 105px;
  padding: 12px 20px;
  transform: translateX(-12px) rotate(-1.5deg);
  transition: none;
}

.rh-intent-fit .rh-intent-piece--search {
  padding-right: 36px;
  --rh-intent-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 170' preserveAspectRatio='none'%3E%3Cpath d='M3 4Q37 -1 76 3Q109 8 142 4Q177 0 214 3Q245 7 274 5L275 58C287 51 299 61 299 83C299 102 287 111 275 103L274 164Q243 170 211 166Q177 161 145 164Q110 172 76 167Q39 161 3 165Q-1 139 4 106Q8 77 3 50Q1 25 3 4Z'/%3E%3C/svg%3E");
}

.rh-intent-fit .rh-intent-piece--identity {
  margin-left: -9.09091%;
  padding-left: 52px;
  transform: translateX(12px) rotate(1.5deg);
  --rh-intent-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 170' preserveAspectRatio='none'%3E%3Cpath d='M25 5Q56 -1 86 3Q120 9 154 4Q187 0 219 2Q263 7 297 4Q301 31 298 56Q292 83 296 111Q302 139 298 164Q265 172 229 166Q191 160 156 165Q123 172 91 167Q57 162 24 165L25 103C37 111 49 102 49 83C49 61 37 51 25 58Z'/%3E%3C/svg%3E");
}

.rh-intent-fit .rh-intent-piece.rh-paper::before { inset: 0; background: var(--paper-raised) url('/assets/concept-paper.80a769ad7741.webp') center / 640px; mask: var(--rh-intent-shape) center / 100% 100% no-repeat; }
.rh-intent-fit .rh-intent-piece .p-workspace-layers { display: none; }
.rh-intent-fit .rh-intent-edge { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
.rh-intent-fit .rh-intent-edge path { fill: none; stroke: var(--ink); stroke-width: 1.2; stroke-linejoin: round; vector-effect: non-scaling-stroke; opacity: .68; }
.rh-intent-fit .rh-intent-edge .rh-intent-echo { stroke-width: .7; stroke-linecap: round; opacity: .24; }
.rh-intent-fit .rh-intent-piece-content { position: relative; }
.rh-intent-fit .rh-intent-piece .rh-intent-person { display: flex; flex-wrap: wrap; align-items: center; column-gap: 6px; row-gap: 2px; margin: 0 0 7px; font-size: 14px; line-height: 1.2; font-weight: 400; }
.rh-intent-fit .rh-intent-person .rh-avatar { width: 20px; height: 20px; }
.rh-intent-fit .rh-intent-person strong { font-weight: 650; }
.rh-intent-fit .rh-intent-label { font-weight: 500; }
.rh-intent-fit .rh-intent-piece dl { margin: 0; }
.rh-intent-fit .rh-intent-role { font-size: 18px; line-height: 1.35; margin: 0 0 var(--p-s4); }
.rh-intent-fit .rh-intent-piece dt { margin: 0 0 4px; font-size: 14px; line-height: 1.3; font-weight: 650; }
.rh-intent-fit .rh-intent-piece dd { margin: 0; font-size: 15px; line-height: 1.4; text-wrap: pretty; }
.rh-intent-fit .rh-intent-explanation { margin: 12px auto 0; font-size: 15px; line-height: 1.45; text-align: center; }
[data-film] .rh-intent-piece--search { transform: translateX(calc(var(--scene-join,1) * var(--rh-join-gap) * -1)) rotate(calc(var(--scene-join,1) * -2deg)); }
[data-film] .rh-intent-piece--identity { transform: translateX(calc(var(--scene-join,1) * var(--rh-join-gap))) rotate(calc(var(--scene-join,1) * 2deg)); }

@media (max-width: 600px) {
  .rh-intent-fit .rh-intent-row { --rh-join-gap: 12px; }
  .rh-phone.rh-v4-phone { --rh-phone-inset: var(--p-s2); --rh-app-copy: var(--p-s4); --rh-app-name: 18px; --rh-app-action: var(--p-s5); height: 420px; max-width: 230px; background-size: 130% 100%; }
  .rh-v4-phone .rh-v4-phone-screen { left: 10%; width: 80%; font-size: var(--rh-app-copy); }
  .rh-v4-phone .rh-v4-phone-panel { padding: var(--p-s1) 0 var(--p-s8); }
  .rh-v4-phone .rh-v4-phone-person { gap: 5px; margin-bottom: 8px; }
  .rh-v4-phone .rh-v4-phone-photo { width: 34px; }
  .rh-v4-phone .rh-v4-phone-intents > div + div { margin-top: 8px; }
  .rh-v4-phone .rh-v4-phone-intents dt { font-size: 14px; margin-bottom: 3px; }
  .rh-v4-phone .rh-v4-phone-intents dd { font-size: var(--rh-app-copy); line-height: 1.25; }
  .rh-v4-phone .rh-v4-phone-presence { margin-top: 10px; font-size: 14px; line-height: 1.2; }
  .rh-v4-phone .rh-v4-phone-notice { gap: var(--p-s2); }
  .rh-v4-phone .rh-v4-phone-notice-person { gap: var(--p-s1); }
  .rh-v4-phone .rh-v4-phone-notice-photo { width: 32px; }
  .rh-app-match { padding: var(--p-s2); }
  .rh-v4-phone .rh-v4-phone-chat-header { gap: 5px; padding-bottom: 7px; margin-bottom: 10px; align-items: flex-start; }
  .rh-v4-phone .rh-v4-phone-chat-photo { width: 25px; }
  .rh-v4-phone .rh-v4-phone-messages { gap: 11px; padding-inline: 3px; }
  .rh-v4-phone .rh-v4-phone-message { max-width: 96%; padding: 7px 8px; font-size: var(--rh-app-copy); line-height: 1.3; }
  .rh-intent-fit .rh-intent-piece { padding: 10px 14px; min-height: 122px; }
  .rh-intent-fit .rh-intent-piece--search { padding-right: 30px; }
  .rh-intent-fit .rh-intent-piece--identity { padding-left: 38px; padding-right: 12px; }
  .rh-intent-fit .rh-intent-piece .rh-intent-person { margin-bottom: 6px; }
  .rh-intent-fit .rh-intent-piece dd { font-size: 14px; line-height: 1.35; }
  .rh-intent-fit .rh-intent-role { font-size: 16px; margin-bottom: var(--p-s3); }
  .rh-fit-opportunity { margin-bottom: var(--p-s4); }
  .rh-fit-ticket { padding: var(--p-s3) var(--p-s4); }
  .rh-fit-ticket > .rh-pen { font-size: calc(var(--p-s6) + var(--p-s1)); }
  .rh-intent-fit .rh-intent-explanation { font-size: 14px; line-height: 1.4; }
}

@media (prefers-reduced-motion: reduce) {
  .rh-intent-fit .rh-intent-piece { transform: none; transition: none; }
}

@media (forced-colors: active) {
  .rh-phone.rh-v4-phone { background: none; height: auto; min-height: 320px; border: 1px solid CanvasText; }
  .rh-v4-phone .rh-v4-phone-screen { position: relative; inset: auto; width: auto; height: auto; padding: 16px; }
  .rh-v4-phone .rh-v4-phone-message { border: 1px solid CanvasText; }
  .rh-v4-phone .rh-v4-phone-message::after { display: none; }
  .rh-intent-fit .rh-intent-row { gap: 12px; }
  .rh-intent-fit .rh-intent-piece.rh-paper::before { mask: none; background: Canvas; }
  .rh-intent-fit .rh-intent-piece { flex-basis: calc(50% - 6px); margin-left: 0; padding: 16px; outline: 1px solid CanvasText; transform: none; }
  .rh-intent-fit .rh-intent-edge { display: none; }
}
/* Pen-drawn app chrome, not outside-device explanatory labels. */
.rh-v4-phone-screen { overflow: hidden; }
.rh-app-top { height: 30px; display: flex; align-items: center; justify-content: space-between; position: relative; margin: 0 var(--rh-phone-inset) var(--p-s2); }
.rh-app-top>.rh-pen { font-size: 25px; line-height: 1; }
.rh-app-top svg,.rh-app-compose svg { width: 16px; height: 20px; fill: none; stroke: var(--ink); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.rh-app-top::after,.rh-app-tabs::before,.rh-v4-phone-intents>div::after { content: ''; position: absolute; left: 0; right: 0; height: 3px; bottom: -1px; background: var(--ink); mask: var(--rh-ink-line) center/100% 100% no-repeat; opacity: .48; }
.rh-v4-phone-intents>div { position: relative; padding-bottom: 3px; }
.rh-v4-phone .rh-v4-phone-intents dt { font-family: var(--font-pen); font-size: 22px; font-weight: 400; line-height: 1; }
.rh-app-tabs { position: absolute; bottom: 0; left: 0; right: 0; display: flex; justify-content: space-between; gap: 5px; padding-top: 6px; font: 18px/1 var(--font-pen); }
.rh-app-tabs::before { top: 0; bottom: auto; }
.rh-app-tabs>span:first-child { text-decoration: underline; text-underline-offset: 3px; }
.rh-app-actions { display: grid; gap: var(--p-s1); text-align: center; }
.rh-app-yes,.rh-app-compose { position: relative; padding: 6px 8px; }
.rh-app-yes { display: flex; align-items: center; justify-content: center; gap: var(--p-s1); min-height: calc(var(--p-s10) + var(--p-s1)); padding-inline: var(--p-s2); background: var(--paper-raised); color: var(--ink); font: var(--rh-app-action)/1.15 var(--font-pen); transform: translateY(calc(var(--rh-choice-press,0) * 2px)) scale(calc(1 - var(--rh-choice-press,0) * .015)); pointer-events: none; }
.rh-app-yes > svg { width: var(--p-s4); height: var(--p-s4); fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; opacity: 0; }
.rh-app-choice-label { white-space: nowrap; }
.rh-app-yes[data-yes='true'] > svg { opacity: 1; }
.rh-app-yes::before,.rh-app-compose::before { content: ''; position: absolute; inset: 0; background: var(--ink); mask: var(--rh-ink-box) center/100% 100% no-repeat; opacity: .72; pointer-events: none; }
.rh-app-yes[data-yes='true'] { color: var(--rh-chat-on-outgoing); background: var(--rh-chat-outgoing); border-radius: 2px 5px 3px 4px; }
.rh-app-pass { width: fit-content; justify-self: center; padding-bottom: var(--p-s1); background: var(--rh-ink-line) center bottom / 100% 2px no-repeat; font-size: var(--rh-app-meta); line-height: 1.2; }
[data-accepted='true'] .rh-app-pass { visibility: hidden; }
.rh-app-compose { position: absolute; bottom: 0; left: 0; right: 0; display: flex; align-items: center; justify-content: space-between; font: 20px/1 var(--font-pen); }
.rh-v4-phone [data-phone-profile] .rh-v4-phone-presence { display: none; }
@media(max-width:600px) {
  .rh-app-top>.rh-pen { font-size: 23px; }
  .rh-v4-phone .rh-v4-phone-intents dt { font-size: 20px; }
  .rh-v4-phone .rh-v4-phone-intents dd { font-size: var(--rh-app-copy); line-height: 1.25; }
  .rh-v4-phone .rh-v4-phone-photo { width: 28px; }
  .rh-app-tabs { font-size: 17px; }
  .rh-app-yes { min-height: var(--p-s10); }
  .rh-app-compose { font-size: 18px; }
}
@media (max-width: 360px) {
  .rh-phone.rh-v4-phone { --rh-app-copy: 15px; }
  .rh-app-top > .rh-pen { font-size: var(--p-s5); }
  .rh-app-yes { padding-inline: var(--p-s1); }
  .rh-app-yes > svg { width: var(--p-s3); height: var(--p-s3); }
  .rh-app-pass { display: none; }
}
@media (forced-colors: active) {
  .rh-app-match { color: CanvasText; filter: none; outline: 1px solid CanvasText; }
  .rh-app-match::before { background: Canvas; mask: none; }
  .rh-app-yes,.rh-app-yes[data-yes='true'] { color: CanvasText; background: Canvas; outline: 1px solid CanvasText; }
  .rh-app-yes::before { display: none; }
}
