/* On site: Qiv's estimate editor — the paper, its dock, and the sheets that fill it in. */
.app-onsite > * { position: absolute; left: 0; top: 0; }
.os-mesh { inset: 0; width: 393px; height: 886px; }
.os-sb { width: 393px; height: 50px; }
.os-back { left: 10px; top: 60px; }
.os-navt { left: 0; top: 62px; width: 393px; }
.os-pvw { left: 339px; top: 54px; width: 40px; height: 40px; border-radius: 20px; }
.os-paper { left: 16px; top: 104px; width: 400px; height: 518px; transform: scale(0.9025); transform-origin: 0 0; border-radius: 20px; overflow: hidden; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), 0 12px 30px rgba(0, 0, 0, 0.08); }
.os-paper .pp { border-radius: 20px; }
.os-paper .pp-to { opacity: 0; }
.os-billph { position: absolute; left: 196px; top: 103px; width: 172px; height: 48px; padding: 8px 10px; border-radius: 8px; border: 1.2px dashed #b9c3bf; background: #fbfcfb; transform-origin: 50% 50%; }
.os-billph small { display: block; font-size: 4.9px; font-weight: 700; letter-spacing: 1px; color: var(--q-em); }
.os-billph b { display: block; margin-top: 6px; font-size: 9.5px; font-weight: 650; color: var(--q-em); }
.os-addline { position: absolute; left: 32px; top: 176px; width: 336px; height: 20px; display: flex; align-items: center; gap: 5px; color: var(--q-em); transform-origin: 0 50%; }
.os-addline .sg { width: 11px; height: 11px; padding: 1.5px; border-radius: 50%; background: rgba(37, 133, 102, 0.12); stroke-width: 2.6; }
.os-addline b { font-size: 7.4px; font-weight: 700; }
.os-addline span { margin-left: auto; font-size: 6px; color: var(--q-faint); }
.os-hl { position: absolute; left: 30px; top: 0; width: 340px; height: 24px; border-radius: 4px; background: rgba(37, 133, 102, 0.1); box-shadow: inset 0 0 0 1px rgba(37, 133, 102, 0.4); opacity: 0; }
.os-mark { left: 16px; top: 588px; width: 174px; height: 48px; border-radius: 24px; }
.os-share { left: 203px; top: 588px; width: 174px; height: 48px; border-radius: 24px; }
.os-slider { left: 16px; top: 648px; width: 361px; height: 54px; border-radius: 27px; overflow: hidden; }
.os-foot { left: 16px; top: 718px; width: 361px; height: 66px; border-radius: 22px; background: #fff; box-shadow: inset 0 0 0 1px rgba(32, 37, 42, 0.08); }
.os-foot > span { position: absolute; left: 18px; top: 15px; display: flex; flex-direction: column; gap: 3px; }
.os-foot small { font-size: 9.5px; font-weight: 700; letter-spacing: 0.12em; color: var(--q-muted); }
.os-foot em { font-style: normal; font-size: 12px; color: var(--q-faint); white-space: nowrap; }
.os-famt { position: absolute; right: 18px; top: 13px; font-family: var(--q-serif); font-size: 29px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.os-fc { font-size: 0.55em; vertical-align: 0.7em; }

.os-dim { width: 393px; height: 886px; background: #000; opacity: 0; }
.os-billto { top: 416px; width: 393px; height: 470px; border-radius: 12px 12px 0 0; visibility: hidden; }
.os-billto > *, .os-book > *, .os-totals > *, .os-rem > * { position: absolute; }
.os-billto .qnav-r { width: 24px; height: 24px; }
.os-blist { left: 16px; top: 64px; width: 361px; height: 240px; }
.os-bc { padding-left: 64px !important; }
.os-av { position: absolute; left: 14px; top: 11px; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, #4b565d, #20252a); color: #fff; font-size: 15px; font-weight: 700; }
.os-bct b { display: block; font-size: 16px; font-weight: 600; }
.os-bct small { display: block; margin-top: 1px; font-size: 12.5px; color: #8a8a8e; }
.os-menu { left: 46px; top: 290px; width: 236px; border-radius: 14px; background: rgba(249, 249, 249, 0.98); box-shadow: 0 14px 40px rgba(0, 0, 0, 0.22), 0 0 0 0.5px rgba(0, 0, 0, 0.08); overflow: hidden; transform-origin: 10% 0; visibility: hidden; }
.os-mi { display: flex; align-items: center; justify-content: space-between; flex-direction: row-reverse; height: 44px; padding: 0 16px; font-size: 16px; }
.os-mi + .os-mi { box-shadow: inset 0 0.6px 0 rgba(60, 60, 67, 0.2); }
.os-mi .sg { width: 18px; height: 18px; color: #1c1c1e; }
.os-mi b { font-weight: 400; }
.os-book { top: 300px; width: 393px; height: 586px; border-radius: 12px 12px 0 0; visibility: hidden; }
.os-bsearch { left: 16px; top: 56px; width: 361px; height: 36px; border-radius: 10px; background: rgba(118, 118, 128, 0.12); display: flex; align-items: center; gap: 6px; padding: 0 10px; color: #8a8a8e; font-size: 16px; }
.os-bsearch .sg { width: 17px; height: 17px; }
.os-bclip { left: 0; top: 108px; width: 393px; height: 478px; overflow: hidden; }
.os-blist2 { position: absolute; left: 0; top: 0; width: 393px; height: 1200px; }
.os-blist2 > * { position: absolute; left: 0; }
.os-bs { left: 20px !important; height: 34px; padding-top: 10px; display: flex; gap: 8px; align-items: baseline; }
.os-bs b { font-size: 12.5px; font-weight: 700; letter-spacing: 0.08em; color: #6d6d72; }
.os-bs span { font-size: 12px; color: #8a8a8e; }
.os-br { width: 393px; height: 54px; padding: 8px 20px; }
.os-br b { display: block; font-size: 16px; font-weight: 600; white-space: nowrap; }
.os-br span { display: block; margin-top: 2px; font-size: 13px; color: #8a8a8e; }
.os-br::after { content: ""; position: absolute; left: 20px; right: 0; bottom: 0; height: 0.6px; background: rgba(60, 60, 67, 0.16); }
.os-plus { position: absolute; right: 18px; top: 13px; width: 28px; height: 28px; border-radius: 50%; color: var(--q-em); background: rgba(37, 133, 102, 0.12); padding: 6px; }
.os-plus em { position: absolute; inset: 0; border-radius: 50%; background: var(--q-em); color: #fff; padding: 6px; opacity: var(--added, 0); }
.os-fly { left: 0; top: 0; width: 330px; height: 26px; padding: 4px 10px; border-radius: 8px; background: #fff; box-shadow: 0 10px 26px rgba(0, 0, 0, 0.18), inset 0 0 0 1px rgba(37, 133, 102, 0.35); display: flex; justify-content: space-between; align-items: center; font-size: 13px; transform-origin: 0 0; visibility: hidden; z-index: 40; }
.os-fly b { font-weight: 650; }
.os-fly span { font-weight: 700; color: var(--q-em); }

/* the Totals sheet */
.os-totals { top: 226px; width: 393px; height: 660px; border-radius: 12px 12px 0 0; visibility: hidden; }
.os-totals .qnav-t { top: 22px; } .os-totals .qnav-r { top: 22px; }
.os-tf1 { left: 16px; top: 66px; width: 361px; height: 88px; }
.os-ts1 { top: 170px; }
.os-tf2 { left: 16px; top: 194px; width: 361px; height: 132px; }
.os-tf2 .qrow:nth-child(2) { top: 44px; } .os-tf2 .qrow:nth-child(3) { top: 88px; }
.os-tf1 .qrow:nth-child(2) { top: 44px; }
.os-tval { display: flex; align-items: center; gap: 4px; }
.os-tval .sg, .os-tf3 .sg { width: 14px; height: 14px; }
.os-tfoot1 { top: 332px; }
.os-ts2 { top: 380px; }
.os-tf3 { left: 16px; top: 404px; width: 361px; height: 44px; overflow: hidden; }
.os-tf3 .qrow:nth-child(2) { top: 44px; } .os-tf3 .qrow:nth-child(3) { top: 88px; }
.os-tf3 .v.em { display: flex; align-items: center; gap: 4px; }
.os-tf3 .qtog { margin-left: auto; }
.os-tfoot2 { top: 454px; }
.os-tf4 { left: 16px; top: 504px; width: 361px; height: 44px; }
.os-tf4 b { font-weight: 650; }

/* valid for */
.os-valid { left: 150px; top: 182px; width: 214px; padding: 6px 0; border-radius: 14px; background: rgba(249, 249, 249, 0.98); box-shadow: 0 14px 40px rgba(0, 0, 0, 0.22), 0 0 0 0.5px rgba(0, 0, 0, 0.08); transform-origin: 90% 0; visibility: hidden; }
.os-valid small { display: block; padding: 6px 16px 8px; font-size: 12.5px; color: #8a8a8e; }
.os-vo { position: relative; z-index: 1; display: flex; align-items: center; gap: 10px; height: 40px; padding: 0 16px; font-size: 16px; }
.os-vo .sg { width: 15px; height: 15px; opacity: var(--chk, 0); color: #1c1c1e; stroke-width: 2.4; }
.os-vo b { font-weight: 400; }
.os-vhl { position: absolute; left: 6px; right: 6px; top: 0; height: 40px; border-radius: 9px; background: rgba(0, 0, 0, 0.07); }

/* reminders */
.os-rem { top: 96px; width: 393px; height: 790px; border-radius: 12px 12px 0 0; visibility: hidden; }
.os-rem .qnav-t, .os-rem .qnav-r { top: 22px; }
.os-rf1 { left: 16px; top: 66px; width: 361px; height: 44px; }
.os-rft { top: 116px; }
.os-rs1 { top: 172px; }
.os-rf2 { left: 16px; top: 196px; width: 361px; height: 176px; }
.os-rs2 { top: 390px; }
.os-rf3 { left: 16px; top: 414px; width: 361px; height: 88px; }
.os-rf3 .qrow:nth-child(2) { top: 44px; }
.os-rem .qtog, .os-rem .qstep { margin-left: auto; }
.os-rf3 .qrow { font-size: 15.5px; }
.os-rft2 { top: 508px; }

/* a week later: the Lock Screen at 9:00 */
.os-lock { width: 393px; height: 886px; visibility: hidden; color: #fff; }
.os-lock > * { position: absolute; left: 0; top: 0; }
.os-wall { width: 393px; height: 886px; background: linear-gradient(165deg, #6f8fa8 0%, #3f5a73 40%, #26364b 75%, #1a2433 100%); }
.os-lsb { width: 393px; height: 50px; }
.os-ldate { width: 393px; top: 96px; text-align: center; font-size: 19px; font-weight: 600; color: rgba(255, 255, 255, 0.9); }
.os-ltime { width: 393px; top: 118px; text-align: center; font-size: 104px; font-weight: 600; letter-spacing: -0.02em; line-height: 1; }
.os-note { left: 12px !important; top: 296px !important; width: 369px; height: 100px; border-radius: 22px; background: rgba(245, 246, 245, 0.94); color: #111; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18); }
.os-note > * { position: absolute; }
.os-note img { left: 14px; top: 14px; width: 38px; height: 38px; border-radius: 9px; }
.os-note p { left: 64px; right: 16px; top: 14px; display: flex; justify-content: space-between; font-size: 13px; color: #6d6d72; }
.os-note p b { font-weight: 600; color: #6d6d72; letter-spacing: 0.02em; }
.os-nt { left: 64px; top: 33px; font-size: 15.5px; font-weight: 650; }
.os-note > span { left: 64px; right: 16px; top: 54px; font-size: 14.5px; line-height: 1.3; color: #2b2b2e; }
.os-home { left: 129px; top: 868px; width: 135px; height: 5px; border-radius: 3px; background: rgba(255, 255, 255, 0.85); }

/* under the Tax statement: where the Totals sheet is set for */
.os-reg { margin-top: clamp(14px, 2.2vh, 22px); }
.os-reg-k { font-size: 12.5px; font-weight: 640; color: var(--ink-3); }
.os-reg-row { position: relative; display: inline-flex; margin-top: 8px; padding: 3px; border-radius: 999px; background: var(--chip); box-shadow: inset 0 0 0 1px var(--line); }
.os-reg-row span { position: relative; z-index: 1; padding: 6px 13px; font-size: 13.5px; font-weight: 620; color: var(--ink-2); white-space: nowrap; }
.os-reg-row span.on { color: var(--thumb-ink); }
.os-reg-th { position: absolute; left: 0; top: 3px; bottom: 3px; width: 60px; border-radius: 999px; background: var(--acc); }
.os-reg-t { margin-top: 8px; font-size: 14.5px; color: rgba(var(--ink-rgb), var(--soft)); }
.os-reg-t b { color: var(--ink); font-weight: 680; }