/* =============================================================================
   proposals.css — r3 · prop-ui-edit · 26 Sep 2026 — the Proposals screens
   (proposals.js: the Proposals screen, the template editor, the preview, and
   the sheet / toast / confirm every proposals screen shares).
   Linked from dashboard.php after app.css and board.css; the look is theirs:
   the navy ground, the console cards (.bc), mono caps labels, the orange
   accent, the chamfered buttons (.b). Every token is read from app.css :root
   with the literal as a fallback. Every class here starts .jp- so nothing on
   the dashboard can be touched by it; the one exception is the block right
   below, which hides the page while a screen is over it.
   ============================================================================= */

/* ---- the page behind a screen: hidden (not moved) and still ------------- */
/* While any Proposals screen is open the dashboard under it is hidden — its
   tab bar, app bar, Ask Jetsy button and toast would otherwise sit under (or,
   with a stylesheet we cannot see, over) the screen — and the page does not
   scroll under the thumb. It comes back exactly where it was. */
html.jp-lock,html.jp-lock body{overflow:hidden !important}
body.jp-open>.install,body.jp-open>.demobar,body.jp-open>header.appbar,body.jp-open>main,
body.jp-open>footer,body.jp-open>nav.tabs,body.jp-open>#toast,body.jp-open>.j2,
html body.jp-open #j2btn.j2-btn{visibility:hidden !important}
/* the Ask Jetsy button in the app bar says visible !important (app.css,
   html.j2-bar … #j2btn.j2-btn); this outranks it only while a screen is open */
html.j2-bar body.jp-open header.appbar #j2btn.j2-btn{visibility:hidden !important}

/* ---- the screen: full height, the header under the clock, the footer
        over the home bar, the middle scrolls --------------------------------- */
.jp-sheet{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2000;display:flex;flex-direction:column;
  background:var(--void,#05090F);color:var(--ink,#E9F2FB);
  font-family:Poppins,ui-sans-serif,system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.55;
  -webkit-text-size-adjust:100%;overflow:hidden;outline:0;animation:jp-in .18s ease-out}
.jp-sheet:focus,.jp-sheet:focus-visible{outline:0}
.jp-sheet.jp-under{visibility:hidden}
@keyframes jp-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.jp-sheet [hidden]{display:none !important}

/* the header: Back · the screen's name as a kicker · Save; its ground runs up
   under the clock like the app bar's */
.jp-hd{flex:none;position:relative;z-index:2;padding-top:env(safe-area-inset-top,0px);
  background:linear-gradient(180deg,var(--console-lit,#15273A) 0%,#101F30 100%);
  box-shadow:inset 0 -1px 0 var(--line2,#132335)}
.jp-hd-in{max-width:44rem;margin:0 auto;display:flex;align-items:center;gap:.6rem;
  padding:.5rem .9rem;min-height:3.6rem;min-width:0}
.jp-hd .b{flex:none;white-space:nowrap}
.jp-title{flex:1 1 auto;min-width:0;margin:0;display:flex;align-items:center;gap:.5rem;
  font-family:var(--mono,ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace);
  font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--or-lt,#FFB259);line-height:1.3;overflow-wrap:anywhere}
.jp-title::before{content:"";width:14px;height:2px;background:var(--or,#FF6A1A);flex:0 0 auto;
  box-shadow:0 0 8px rgba(255,106,26,.5)}

/* the middle: its own scroller; nothing in it may push sideways */
.jp-bd{flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;
  overscroll-behavior:contain}
.jp-page{max-width:44rem;margin:0 auto;padding:.35rem .9rem 1.4rem;min-width:0}
.jp-sheet.jp-noft .jp-page{padding-bottom:calc(env(safe-area-inset-bottom,0px) + 1.4rem)}

/* the footer: the screen's main buttons, clear of the home bar */
.jp-ft{flex:none;position:relative;z-index:2;background:var(--deep,#0A1622);
  box-shadow:inset 0 1px 0 var(--line,#1C3047);padding-bottom:env(safe-area-inset-bottom,0px)}
.jp-ft-in{max-width:44rem;margin:0 auto;display:flex;gap:.5rem;padding:.6rem .9rem;min-width:0}
.jp-ft-in>.b{flex:1 1 0;min-width:0;white-space:normal;text-align:center}
.jp-sheet .b.jp-big{min-height:52px;font-size:1rem}
.jp-sheet .b[disabled]{opacity:.4;pointer-events:none}
.jp-sheet .b.jp-busy{opacity:.4;pointer-events:none}

/* ---- cards and fields --------------------------------------------------- */
.jp-sheet .jp-card{margin:.75rem 0}
.jp-sheet .jp-card .bc-hd h2{overflow-wrap:anywhere}
.jp-sheet .jf label,.jp-lbl{display:block;font-family:var(--mono,ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace);
  font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted,#7B94AC);
  margin:0 0 .25rem;line-height:1.35}
.jp-f{margin-top:.8rem;min-width:0}
/* 16px in every box: iOS zooms the page into a box whose text is smaller */
.jp-sheet .jp-card .jp-inp,.jp-sheet .jp-inp{display:block;width:100%;min-width:0;min-height:44px;
  background:var(--deep,#0A1622);color:var(--ink,#E9F2FB);border:0;
  box-shadow:var(--hair,inset 0 0 0 1px #1C3047);border-radius:var(--cut-sm,2px 8px 2px 8px);
  padding:.55rem .65rem;font:inherit;font-size:16px;line-height:1.45;letter-spacing:0;text-transform:none;
  color-scheme:dark;-webkit-appearance:none;appearance:none}
.jp-sheet .jp-card textarea.jp-inp{resize:none;overflow:hidden;min-height:44px}
.jp-sheet .jp-card .jp-inp:focus,.jp-sheet .jp-inp:focus{outline:0;
  box-shadow:inset 0 0 0 1px var(--or,#FF6A1A),0 0 0 3px rgba(255,106,26,.18)}
.jp-sheet .jp-card .jp-inp.jp-line+.jp-inp.jp-line{margin-top:.4rem}
.jp-hint{margin:.3rem 0 0;font-size:.78rem;line-height:1.45;color:var(--muted,#7B94AC)}
.jp-fnote{margin:.35rem 0 0;font-size:.8rem;line-height:1.45;color:var(--warn,#FFC24D)}
.jp-fnote.jp-bad{color:var(--hot,#FF6B5E)}
.jp-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.5rem;align-items:end}
.jp-two>.jp-f{margin-top:.8rem}
.jp-sheet .b.jp-wide{width:100%;margin-top:1rem}
.jp-sheet .b.jp-add{width:100%;margin-top:.6rem}
.jp-sheet .b.jp-quiet{box-shadow:none;background:transparent;color:var(--ink2,#B4C8DC)}
.jp-k{font-family:var(--mono,ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace);
  font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--or-lt,#FFB259);margin:0 0 .45rem}
.jp-range{display:block;width:100%;min-height:44px;margin:0;accent-color:var(--or,#FF6A1A)}

/* loading, a failure with its Try again, the note when sending is off */
.jp-load{padding:2.6rem 0;text-align:center;color:var(--muted,#7B94AC);
  font-family:var(--mono,ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace);
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase}
.jp-err{padding:2rem .4rem;display:flex;flex-direction:column;align-items:center;gap:.9rem;text-align:center}
.jp-err-m{margin:0;color:var(--ink2,#B4C8DC);font-size:.92rem;line-height:1.5;max-width:30ch}
.jp-warn{margin:.75rem 0 0;padding:.7rem .8rem;border-radius:var(--cut-row,3px 10px 3px 10px);
  background:rgba(255,194,77,.1);box-shadow:inset 0 0 0 1px rgba(255,194,77,.35);
  color:var(--warn,#FFC24D);font-size:.84rem;line-height:1.5}

/* ---- Your templates ------------------------------------------------------ */
.jp-tl{list-style:none;margin:.35rem 0 0;padding:0;display:flex;flex-direction:column;gap:.5rem}
.jp-t{background:var(--panel2,#101D2C);box-shadow:var(--hair,inset 0 0 0 1px #1C3047);
  border-radius:var(--cut-row,3px 10px 3px 10px);padding:.3rem .5rem .55rem;min-width:0}
.jp-t-main{display:flex;flex-direction:column;align-items:flex-start;gap:.05rem;width:100%;min-height:44px;
  background:none;border:0;padding:.35rem .25rem .45rem;color:inherit;text-align:left;cursor:pointer;font:inherit}
.jp-t-n{font-size:1rem;font-weight:600;line-height:1.3;overflow-wrap:anywhere;color:var(--ink,#E9F2FB)}
.jp-t-s{font-size:.8rem;line-height:1.35;color:var(--ink2,#B4C8DC);overflow-wrap:anywhere}
.jp-t-acts{display:flex;flex-wrap:wrap;gap:.4rem;padding:0 .25rem}
.jp-t-acts .b{flex:1 1 auto}
.jp-pick{margin-top:.6rem;padding:.75rem .7rem;background:var(--panel2,#101D2C);
  box-shadow:inset 0 0 0 1px rgba(255,106,26,.4);border-radius:var(--cut-row,3px 10px 3px 10px)}
.jp-pick-b{display:flex;flex-direction:column;gap:.45rem}
.jp-pick-b .b{width:100%;justify-content:flex-start;text-align:left;white-space:normal}
.jp-pick-b .b.jp-quiet{justify-content:center}
.jp-pick-b .b.jp-more{justify-content:center}
.jp-more-l{display:flex;flex-direction:column;gap:.45rem;margin-top:.3rem}
.jp-more-l .jp-k{margin:.2rem 0 0}

/* ---- Letterhead: the top of the paper, on white, as it will print -------- */
.jp-paper{display:flex;flex-wrap:wrap;align-items:flex-start;gap:.55rem .7rem;margin:.75rem 0 .7rem;
  padding:.85rem .8rem .75rem;background:#fff;color:#21262B;border-radius:3px;
  box-shadow:0 0 0 1px var(--line,#1C3047),0 10px 24px -14px #000;min-width:0}
.jp-lh-logo{flex:0 0 auto;min-width:0;max-width:56%}
.jp-lh-logo img{display:block;width:100%;height:auto}
.jp-lh-logo.jp-nologo{width:38%;min-height:3.4rem;display:flex;align-items:center;justify-content:center;
  border:1px dashed #9AA5B1;border-radius:2px;padding:.3rem;text-align:center;color:#5A6570;
  font-size:.7rem;line-height:1.3}
.jp-lh-tx{flex:1 1 7.5rem;min-width:0;text-align:right;font-size:.64rem;line-height:1.5;color:#21262B;
  overflow-wrap:anywhere;font-family:Arial,Helvetica,sans-serif}
.jp-lh-tx u{color:#1a55c4}
.jp-lh-rule{flex:0 0 100%;height:3px;border-radius:2px}
.jp-logo-acts{display:flex;flex-wrap:wrap;gap:.5rem}
.jp-logo-acts .b{flex:1 1 8rem}
.jp-up{cursor:pointer}
.jp-upmsg{margin-top:.45rem;display:flex;flex-wrap:wrap;align-items:center;gap:.3rem .5rem;min-width:0}
.jp-upmsg:empty{display:none}
.jp-upmsg .jp-k{margin:0}
.jp-pct{font-family:var(--mono,ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace);
  font-size:.7rem;color:var(--ink2,#B4C8DC)}
.jp-bar{flex:0 0 100%;height:4px;border-radius:2px;background:var(--line,#1C3047);overflow:hidden}
.jp-bar i{display:block;height:100%;background:var(--or,#FF6A1A);box-shadow:0 0 8px rgba(255,106,26,.5);
  transition:width .2s}
.jp-upmsg .jp-fnote{margin:0}
.jp-sw{display:flex;flex-wrap:wrap;gap:.45rem}
.jp-swb{width:44px;height:44px;flex:none;border:0;padding:0;cursor:pointer;border-radius:var(--cut-sm,2px 8px 2px 8px);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.28)}
.jp-swb.on{box-shadow:0 0 0 2px var(--void,#05090F),0 0 0 4px var(--or,#FF6A1A)}
.jp-hex{margin-top:.6rem}
.jp-wo-l{margin-top:.45rem}
.jp-wo{color:var(--ink,#E9F2FB);font-weight:600}

/* ---- Sent proposals ------------------------------------------------------- */
.jp-sl{list-style:none;margin:.45rem 0 0;padding:0;display:flex;flex-direction:column;gap:.45rem}
.jp-s{display:flex;flex-direction:column;gap:.2rem;min-height:44px;padding:.6rem .7rem;
  background:var(--panel2,#101D2C);box-shadow:var(--hair,inset 0 0 0 1px #1C3047);
  border-radius:var(--cut-row,3px 10px 3px 10px);color:inherit;text-decoration:none;min-width:0}
a.jp-s:active{box-shadow:inset 0 0 0 1px var(--or,#FF6A1A)}
.jp-s1{display:flex;align-items:baseline;justify-content:space-between;gap:.6rem;min-width:0}
.jp-s-n{font-weight:600;min-width:0;overflow-wrap:anywhere}
.jp-s-amt{flex:none;font-weight:600;font-variant-numeric:tabular-nums;color:var(--ink,#E9F2FB)}
.jp-s2{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .55rem;font-size:.8rem;color:var(--ink2,#B4C8DC)}
.jp-s3{font-size:.78rem;color:var(--muted,#7B94AC);overflow-wrap:anywhere}
.jp-s2 .chip{background:rgba(123,148,172,.14);color:var(--ink2,#B4C8DC)}
.jp-s2 .chip.jp-ok{background:rgba(62,213,152,.14);color:var(--ok,#3ED598)}
.jp-s2 .chip.jp-bad{background:rgba(255,107,94,.14);color:var(--hot,#FF6B5E)}
.jp-tip{margin-top:.1rem}

/* ---- the template editor --------------------------------------------------- */
.jp-tokens{margin:.7rem 0 0;font-size:.8rem;line-height:2;color:var(--ink2,#B4C8DC)}
.jp-tokens code{font-family:var(--mono,ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace);
  font-size:.74rem;color:var(--or-lt,#FFB259);background:var(--panel2,#101D2C);
  box-shadow:var(--hair,inset 0 0 0 1px #1C3047);border-radius:3px;padding:.08rem .3rem;white-space:nowrap}
.jp-it{margin:.55rem 0 0;padding:.55rem .55rem .5rem;background:var(--panel2,#101D2C);
  box-shadow:var(--hair,inset 0 0 0 1px #1C3047);border-radius:var(--cut-row,3px 10px 3px 10px);min-width:0}
.jp-row{display:flex;align-items:flex-start;gap:.45rem;min-width:0}
.jp-row .jp-inp{flex:1 1 auto}
.jp-mk{flex:none;width:.9rem;text-align:center;line-height:44px;font-size:.85rem;color:var(--or,#FF6A1A)}
.jp-mk.jp-dash{font-size:1rem;color:var(--or-lt,#FFB259)}
.jp-tools{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.35rem;margin-top:.4rem}
.jp-sheet .b.jp-ic{min-width:44px;padding-left:.4rem;padding-right:.4rem;font-size:1rem;line-height:1}
.jp-sheet .b.jp-subadd{margin-right:auto}
.jp-subs{margin:.2rem 0 0 1.3rem}
.jp-sub{margin-top:.45rem;padding-left:.45rem;box-shadow:inset 2px 0 0 var(--line,#1C3047)}

/* ---- the preview: the paper in a frame, filling the screen ---------------- */
.jp-sheet.jp-fill .jp-bd{overflow:hidden;display:flex;flex-direction:column}
.jp-sheet.jp-fill .jp-page{flex:1 1 auto;display:flex;flex-direction:column;max-width:none;width:100%;padding:0}
.jp-sheet.jp-fill .jp-load,.jp-sheet.jp-fill .jp-err{padding-left:.9rem;padding-right:.9rem}
.jp-pv-note{margin:0;padding:.5rem .9rem;font-size:.78rem;line-height:1.45;color:var(--ink2,#B4C8DC);
  background:var(--deep,#0A1622);box-shadow:inset 0 -1px 0 var(--line2,#132335)}
.jp-frame{position:relative;flex:1 1 auto;min-height:0;background:#fff}
.jp-frame iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;background:#fff}

/* ---- the toast: the app's console slab, above the screen's footer --------- */
.jp-toast{position:fixed;left:0;right:0;margin:0 auto;width:-webkit-max-content;width:max-content;max-width:88vw;
  z-index:3100;bottom:calc(var(--tabh,4.4rem) + env(safe-area-inset-bottom,0px) + .8rem);
  display:flex;align-items:center;gap:.55rem;padding:.6rem 1rem;
  background:var(--console,linear-gradient(180deg,#15273A 0%,#0C1826 100%));color:var(--ink,#E9F2FB);
  font-family:Poppins,ui-sans-serif,system-ui,-apple-system,sans-serif;font-size:.84rem;font-weight:600;line-height:1.4;
  border-radius:var(--cut-sm,2px 8px 2px 8px);box-shadow:inset 0 0 0 1px var(--line,#1C3047),0 12px 30px -12px #000;
  pointer-events:none}
.jp-toast::before{content:"";width:14px;height:2px;background:var(--or,#FF6A1A);flex:none;box-shadow:0 0 8px rgba(255,106,26,.5)}
.jp-toast[hidden]{display:none !important}

/* ---- confirm: a console card over a dimmed screen -------------------------- */
.jp-dlg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:3000;display:flex;align-items:center;justify-content:center;
  padding:calc(env(safe-area-inset-top,0px) + 1rem) 1rem calc(env(safe-area-inset-bottom,0px) + 1rem);
  background:rgba(2,5,9,.74);font-family:Poppins,ui-sans-serif,system-ui,-apple-system,sans-serif;color:var(--ink,#E9F2FB)}
.jp-dlg-box{position:relative;width:100%;max-width:26rem;padding:1.15rem 1rem 1rem;
  background:var(--console,linear-gradient(180deg,#15273A 0%,#0C1826 100%));
  box-shadow:inset 0 0 0 1px var(--line,#1C3047),0 24px 60px -24px #000;border-radius:var(--cut,3px 14px 3px 14px)}
.jp-dlg-box::before,.jp-dlg-box::after{content:"";position:absolute;width:9px;height:9px;pointer-events:none;
  border:1px solid var(--bracket,rgba(255,106,26,.5))}
.jp-dlg-box::before{top:5px;left:5px;border-right:0;border-bottom:0}
.jp-dlg-box::after{bottom:5px;right:5px;border-left:0;border-top:0}
.jp-dlg-m{margin:0 0 1rem;font-size:.95rem;line-height:1.55;overflow-wrap:anywhere}
.jp-dlg-b{display:flex;flex-wrap:wrap;gap:.5rem}
.jp-dlg-b .b{flex:1 1 8rem;white-space:normal;text-align:center}

@media (prefers-reduced-motion:reduce){.jp-sheet{animation:none}.jp-bar i{transition:none}}

/* ===== r3 · prop-ui-send · 26 Sep 2026 — proposals-send.css, appended at merge (integ) ===== */
/* ===== r3 · prop-ui-send · the Send-a-proposal screen · 27 Sep 2026 =====
   Appended to proposals.css at merge. Everything is scoped under .jps (the
   wrapper proposals-send.js puts inside the sheet's body and its foot), so
   nothing here can reach another screen. The look is the console's: the
   cards are board.css's .bc, the fields its .jf labels, the buttons app.css's
   .b / .b.pri; this file only lays them out. Tokens come from app.css :root
   (with the literal value after each, in case). */

.jps{min-width:0}
.jps .bc{margin:.75rem 0}

/* every box 16px: under 16 the phone zooms the page in when he taps it */
.jps .bc .jps-i{font-size:16px;font-family:Poppins,ui-sans-serif,system-ui,-apple-system,sans-serif;letter-spacing:0;text-transform:none}
.jps .bc textarea.jps-i{line-height:1.45}
.jps .bc .jps-i[aria-invalid="true"]{box-shadow:inset 0 0 0 1px var(--hot,#FF6B5E),0 0 0 3px rgba(255,107,94,.18)}
.jps .bc input[type=date].jps-i{display:block;text-align:left;min-height:44px}
/* r4 r3-webkit: an iPhone centres the date inside its box whatever text-align
   says (the same fix board.css makes for the bill dates) */
.jps .bc input[type=date].jps-i::-webkit-date-and-time-value{text-align:left}
.jps-fe{margin:.3rem 0 0;font-size:.8rem;line-height:1.4;color:var(--hot,#FF6B5E)}

/* the template chips: they wrap, a long name wraps inside its chip */
.jps-tpls{margin:.85rem 0 0;min-width:0}
.jps-k{display:block;font-family:var(--mono,monospace);font-size:.58rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--muted,#7B94AC);margin:0 0 .3rem;font-weight:400;line-height:1.3}
.jps-chips{display:flex;flex-wrap:wrap;gap:.4rem;min-width:0}
.jps .jps-chip{max-width:100%;white-space:normal;text-align:left;overflow-wrap:anywhere;font-size:.8rem}
.jps .jps-chip[aria-pressed="true"]{box-shadow:inset 0 0 0 1px var(--or,#FF6A1A);color:var(--or-lt,#FFB259);
  background:rgba(255,106,26,.12)}

/* this job's lines: a row each, a tick box to keep it, the text to tap and
   change. ● and – are the marks the paper prints. */
.jps-k2{margin-top:.8rem}
.jps-list{display:flex;flex-direction:column;gap:.35rem;margin-top:.3rem;min-width:0}
.jps-ln{display:flex;align-items:flex-start;min-width:0;background:var(--panel2,#101D2C);
  box-shadow:var(--hair,inset 0 0 0 1px #1C3047);border-radius:var(--cut-row,3px 10px 3px 10px);padding-right:.35rem}
.jps-ln.jps-sub{margin-left:1.3rem}
.jps-ck{flex:none;display:flex;align-items:center;gap:.35rem;min-height:44px;padding:0 .15rem 0 .6rem;cursor:pointer}
.jps-ck input{width:20px;height:20px;margin:0;accent-color:var(--or,#FF6A1A);cursor:pointer}
.jps-ck input:disabled{cursor:default}
.jps-mk{display:inline-block;width:.8rem;text-align:center;color:var(--or,#FF6A1A);font-size:.78rem;line-height:1}
.jps-tx{flex:1 1 auto;min-width:0;min-height:44px;margin:0;padding:.62rem .3rem;background:none;border:0;
  color:var(--ink,#E9F2FB);font:inherit;font-size:.86rem;line-height:1.45;text-align:left;cursor:text;
  overflow-wrap:anywhere;-webkit-tap-highlight-color:transparent}
.jps-tx:focus-visible{outline:2px solid var(--or,#FF6A1A);outline-offset:-2px}
.jps-ln.jps-offln .jps-tx{color:var(--muted,#7B94AC);text-decoration:line-through}
.jps-ln.jps-offln .jps-mk{color:var(--muted,#7B94AC)}
.jps-ph{color:var(--muted,#7B94AC);font-style:italic}
.jps .bc textarea.jps-ed{flex:1 1 auto;width:auto;min-width:0;min-height:44px;margin:.3rem 0 .3rem .15rem;resize:none;overflow:hidden}
.jps .jps-add{margin-top:.5rem}
.jps-rule{border:0;border-top:1px solid var(--line,#1C3047);margin:.85rem 0 .4rem}

/* the price: money right-aligned, figures in columns */
.jps .bc input.jps-num{text-align:right;font-variant-numeric:tabular-nums}
.jps-sum{margin-top:.75rem;padding-top:.35rem;border-top:1px solid var(--line2,#132335)}
.jps-r{display:flex;justify-content:space-between;align-items:baseline;gap:.8rem;padding:.2rem 0;min-width:0}
.jps-l{min-width:0;font-size:.86rem;color:var(--ink2,#B4C8DC)}
.jps-v{flex:none;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:600}
.jps-r.jps-bal{border-top:1px solid var(--line2,#132335);margin-top:.15rem;padding-top:.35rem}

/* the email */
.jps-cm{display:flex;align-items:center;gap:.6rem;min-height:44px;margin-top:.45rem;cursor:pointer;font-size:.9rem}
.jps-cm input{flex:none;width:20px;height:20px;margin:0;accent-color:var(--or,#FF6A1A)}
.jps-reply{overflow-wrap:anywhere}

/* the preview: the page as the client will see it, in a white frame that
   scrolls on its own */
.jps-fr{height:70vh;min-height:320px;max-height:780px;margin-top:.45rem;background:#fff;
  border-radius:var(--cut-row,3px 10px 3px 10px);overflow:auto;-webkit-overflow-scrolling:touch}
.jps-fr iframe{display:block;width:100%;height:100%;border:0;background:#fff}
.jps-acts{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.7rem;min-width:0}
/* "Open full page" on the home-screen app: the core's fill layout (.jp-frame)
   sizes the frame; without it, proposals-send.js sets the height to what is
   left above the home bar */
.jps-fullpv iframe{display:block;width:100%;border:0;background:#fff;min-height:320px}

/* the bar at the bottom: what went wrong, then Preview and Send */
/* inside the core's footer row (a flex row): take the whole width */
.jps-ft{flex:1 1 100%;min-width:0}
.jps-btns{display:flex;gap:.5rem;min-width:0}
.jps-btns .b{flex:1 1 0;min-width:0;min-height:48px;font-size:.92rem;margin:0}
.jps-btns .b[disabled]{opacity:.65;cursor:default}
.jps-btns .b.jps-dis{opacity:.5}
.jps-err{margin:0 0 .45rem;font-size:.84rem;line-height:1.4;color:var(--hot,#FF6B5E);overflow-wrap:anywhere}
.jps-why{margin:0 0 .45rem;font-size:.8rem;line-height:1.4;color:var(--warn,#FFC24D);overflow-wrap:anywhere}

/* done */
.jps-sentto{margin:.1rem 0 .2rem;font-size:1.02rem;overflow-wrap:anywhere}
.jps-sentto b{font-weight:600;color:var(--ok,#3ED598)}
.jps-sum1{margin:0;font-size:.86rem;color:var(--ink2,#B4C8DC);overflow-wrap:anywhere}
.jps-sum1 .jps-v{font-weight:600;color:var(--ink,#E9F2FB)}
.jps-dot{color:var(--muted,#7B94AC)}
.jps-acts2 .b{flex:1 1 9rem}
/* ===== end r3 · prop-ui-send ===== */

/* ===== end r3 · prop-ui-send ===== */

/* ===== v354 · add-ons (Joe 9 Oct 5:25pm "I’d like you to make 3 major upgrades to our crm") =====
   Add-ons on quotes. The template editor's Optional add-ons: a name, a price and ✕ on one row, and the price
   sheet's add-on lines as chips under them. The Send screen's list uses the quote rows' grid (.jps-qa) and adds
   the "Total · with every add-on" line and Save these add-ons to the template. */
.jp-opt-row{align-items:center}
.jp-sheet .jp-card .jp-inp.jp-opt-amt,.jp-sheet .jp-inp.jp-opt-amt{flex:0 0 6.5rem;width:6.5rem}
.jp-opt-k{margin:.9rem 0 .4rem}
.jp-opt-pb{display:flex;flex-wrap:wrap;gap:.4rem;min-width:0}
.jp-opt-pb .b{max-width:100%;white-space:normal;text-align:left;overflow-wrap:anywhere}
.jps-opts{margin-top:.9rem;padding-top:.65rem;border-top:1px solid var(--line2,#132335)}
.jps-opts .bnote{margin:.2rem 0 .3rem}
.jps-opt-sum{margin:.5rem 0 0;font-size:.86rem;line-height:1.5;color:var(--ink2,#B4C8DC);overflow-wrap:anywhere}
.jps-opt-sum b{color:var(--ink,#E9F2FB);font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
.jps .jps-opt-save{margin-top:.55rem}
.jps-opt .jps-tb{min-width:44px;height:44px;align-self:center}   /* a full-size target beside the 44px boxes */
.jps .jps-qa.jps-opt .jps-i{min-height:44px;padding:0 .7rem}   /* the words clear of the box's edge */
/* ===== end v354 · add-ons ===== */