/* Screen-only; preserve print output, selected-state semantics and action controls. */
@media screen {
  html.jr-soft-interface :is(#shell #main,#main,body) .jr-segmented {
    position:relative;
    isolation:isolate;
    display:inline-flex!important;
    flex-wrap:nowrap!important;
    align-items:center;
    justify-content:flex-start;
    gap:2px!important;
    max-width:100%;
    min-height:0;
    padding:3px!important;
    border:1px solid transparent!important;
    border-radius:999px!important;
    background:#ebe8e1!important;
    box-shadow:none!important;
    overflow-x:auto;
    overflow-y:hidden;
    scrollbar-width:thin;
    font-size:12px;
  }
  html.jr-soft-interface :is(#shell #main,#main,body) .jr-segmented > button {
    position:relative;
    z-index:1;
    flex-shrink:0;
    min-height:34px;
    margin:0!important;
    padding:7px 13px!important;
    border:1px solid transparent!important;
    border-radius:999px!important;
    background:transparent!important;
    color:#696258!important;
    box-shadow:none!important;
    font-size:12px;
    line-height:1.35;
    white-space:nowrap;
    transition:color 160ms ease;
  }
  html.jr-soft-interface :is(#shell #main,#main,body) .jr-segmented[hidden]{display:none!important}
  html.jr-soft-interface :is(#shell #main,#main,body) .jr-segmented > button:hover:not(:disabled){color:#292927!important}
  html.jr-soft-interface :is(#shell #main,#main,body) .jr-segmented > button:focus-visible{outline:2px solid #786d51;outline-offset:-2px}
  html.jr-soft-interface :is(#shell #main,#main,body) .jr-segmented > button:is([aria-pressed="true"],[aria-selected="true"],.selected,.active,.is-active){background:#fff!important;color:#292927!important;font-weight:600}
  html.jr-soft-interface :is(#shell #main,#main,body) .jr-segmented > button:disabled{opacity:.5;cursor:default}
  html.jr-soft-interface :is(#shell #main,#main,body) .jr-segmented::before {
    content:"";
    position:absolute;
    z-index:0;
    left:0;
    top:0;
    width:var(--jr-segment-w,0);
    height:var(--jr-segment-h,0);
    transform:translate3d(var(--jr-segment-x,0),var(--jr-segment-y,0),0);
    border:1px solid #ded8ce;
    box-sizing:border-box;
    border-radius:999px;
    background:#fff;
    box-shadow:0 1px 3px #3029190a;
    pointer-events:none;
    visibility:hidden;
  }
  html.jr-soft-interface :is(#shell #main,#main,body) .jr-segmented[data-jr-indicator-ready]::before{visibility:visible;transition:transform 180ms cubic-bezier(.2,.8,.2,1),width 180ms ease,height 180ms ease}
  html.jr-soft-interface :is(#shell #main,#main,body) .jr-segmented[data-jr-indicator-ready] > button:is([aria-pressed="true"],[aria-selected="true"],.selected,.active,.is-active){background:transparent!important}
  @media(max-width:650px){html.jr-soft-interface :is(#shell #main,#main,body) .jr-segmented > button{font-size:11px;padding-inline:11px!important}}
  @media(prefers-reduced-motion:reduce){html.jr-soft-interface :is(#shell #main,#main,body) .jr-segmented::before,html.jr-soft-interface :is(#shell #main,#main,body) .jr-segmented > button{transition:none!important}}
  @media(forced-colors:active){html.jr-soft-interface :is(#shell #main,#main,body) .jr-segmented{border-color:ButtonText!important}html.jr-soft-interface :is(#shell #main,#main,body) .jr-segmented > button:is([aria-pressed="true"],[aria-selected="true"],.selected,.active,.is-active){outline:2px solid Highlight;outline-offset:-2px}}
}

/* JR designer interface — Development presentation layer.
 * Opt in on each document's <html>, including the branded portal iframe.
 * Screen only. Existing layout, content, type sizes, status colors, focus
 * styles, disabled states, totals and responsive behavior remain authoritative.
 * Deliberately excludes checkout, PDF viewers, print, status pills, switches,
 * circular icon controls, text links, product rows and segmented tab groups.
 */
@media screen {
  html.jr-soft-interface {
    --jr-interface-control-radius: 8px;
    --jr-interface-panel-radius: 12px;
  }

  /* Hosting: rectangular actions only; no blanket button rule. */
  html.jr-soft-interface #shell #content .btn:not(.jr-checkout .btn):not(.doc-pdf-modal .btn):not(.jr-payment-feedback .btn),
  html.jr-soft-interface #shell #content .jr-project-reports .pr-button,
  html.jr-soft-interface #shell #content .jr-docs .doc-actions button:not(.doc-back-link):not(.doc-text-link),
  html.jr-soft-interface #shell #content .jr-docs .doc-editor-actions > button,
  html.jr-soft-interface #shell #content .jr-docs .doc-own-actions button,
  html.jr-soft-interface #shell #content .jr-docs .doc-upload-button,
  html.jr-soft-interface #shell #content .access-password button {
    border-radius: var(--jr-interface-control-radius);
  }

  /* Hosting: existing editable fields. Native checks, radios, file inputs,
   * switches and payment-provider fields are not included. */
  html.jr-soft-interface #shell #content .search,
  html.jr-soft-interface #shell #content .formgrid input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]),
  html.jr-soft-interface #shell #content .formgrid select,
  html.jr-soft-interface #shell #content .formgrid textarea,
  html.jr-soft-interface #shell #content .jr-docs input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not(.doc-pdf-modal input),
  html.jr-soft-interface #shell #content .jr-docs select:not(.doc-pdf-modal select),
  html.jr-soft-interface #shell #content .jr-docs textarea:not(.doc-pdf-modal textarea),
  html.jr-soft-interface #shell #content .jr-docs .doc-rich-editor,
  html.jr-soft-interface #shell #content .my-catalog input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]),
  html.jr-soft-interface #shell #content .my-catalog select,
  html.jr-soft-interface #shell #content .my-catalog textarea,
  html.jr-soft-interface #shell #content .directory-toolbar input,
  html.jr-soft-interface #shell #content .directory-toolbar select,
  html.jr-soft-interface #shell #content .access-password input,
  html.jr-soft-interface #shell #content .jr-project-reports input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
  html.jr-soft-interface #shell #content .jr-project-reports select {
    border-radius: var(--jr-interface-control-radius);
  }

  /* Existing standalone surfaces; no new cards or nested row boxes. */
  html.jr-soft-interface #shell #content .tool,
  html.jr-soft-interface #shell #content .brandcard,
  html.jr-soft-interface #shell #content .editorial,
  html.jr-soft-interface #shell #content .directory-card,
  html.jr-soft-interface #shell #content .directory-featured-card,
  html.jr-soft-interface #shell #content .resource-guide-card,
  html.jr-soft-interface #shell #content .catalog-card,
  html.jr-soft-interface #shell #content .catalog-dialog,
  html.jr-soft-interface #shell #content .doc-own-dialog,
  html.jr-soft-interface #shell #content .doc-quote-review,
  html.jr-soft-interface #shell #content .jr-project-reports .pr-progress-card,
  html.jr-soft-interface #shell #content .jr-project-reports .pr-room-card,
  html.jr-soft-interface #shell #content .jr-project-reports .pr-room-dialog,
  html.jr-soft-interface #shell #content .jr-project-reports .pr-photo-dialog,
  html.jr-soft-interface #shell #content .jr-project-reports .pr-document-group {
    border-radius: var(--jr-interface-panel-radius);
  }

  /* Retain the existing table scroll containers. No new overflow rule,
   * border-collapse change, column width or clipping is introduced. */
  html.jr-soft-interface #shell #content .tablewrap,
  html.jr-soft-interface #shell #content .jr-project-reports .pr-table-wrap {
    border-radius: var(--jr-interface-panel-radius);
  }
  html.jr-soft-interface #shell #content .jr-project-reports .pr-document-group > .pr-group-head:first-child {
    border-start-start-radius: var(--jr-interface-panel-radius);
    border-start-end-radius: var(--jr-interface-panel-radius);
  }
  html.jr-soft-interface #shell #content .jr-project-reports .pr-document-group > .pr-document-row:last-child {
    border-end-start-radius: var(--jr-interface-panel-radius);
    border-end-end-radius: var(--jr-interface-panel-radius);
  }

  /* A modest reduction around headings, without shrinking labels or values. */
  html.jr-soft-interface #shell #content .pagehead {
    margin-bottom: 18px;
  }
  html.jr-soft-interface #shell #content .pagehead h1 {
    margin-top: 6px;
    margin-bottom: 8px;
  }
  html.jr-soft-interface #shell #content .sectionhead {
    margin-top: 18px;
    margin-bottom: 10px;
  }
  html.jr-soft-interface #shell #content .jr-project-reports .pr-head {
    margin-bottom: 18px;
  }
  html.jr-soft-interface #shell #content .jr-project-reports .pr-section-head {
    margin-bottom: 12px;
  }

  /* Branded portal pages / iframe: known rectangular actions. Leave request
   * rows, remove buttons, disclosure links and claim-history links alone. */
  html.jr-soft-interface body.jr-portal.jr-quotes .quote-table button,
  html.jr-soft-interface body.jr-portal.jr-quotes .quote-refresh,
  html.jr-soft-interface body.jr-portal.jr-quotes #print,
  html.jr-soft-interface body.jr-portal.jr-quotes #accept,
  html.jr-soft-interface body.jr-portal.jr-quotes #more,
  html.jr-soft-interface body.jr-portal.jr-request-page .request > button,
  html.jr-soft-interface body.jr-portal.jr-request-page #request-pages > button,
  html.jr-soft-interface body.jr-portal.jr-request-page .row-actions button,
  html.jr-soft-interface body.jr-portal.jr-request-page .entry-actions button,
  html.jr-soft-interface body.jr-portal.jr-request-page .sourcing-toolbar button,
  html.jr-soft-interface body.jr-portal.jr-request-page .sourcing-footer button,
  html.jr-soft-interface body.jr-portal.jr-orders #reload,
  html.jr-soft-interface body.jr-portal.jr-orders #all-claims-open,
  html.jr-soft-interface body.jr-portal.jr-orders #more,
  html.jr-soft-interface body.jr-portal.jr-orders .claim-form button,
  html.jr-soft-interface body.jr-portal.jr-orders .invoice-link,
  html.jr-soft-interface body.jr-portal.jr-settings .actions button,
  html.jr-soft-interface body.jr-portal.jr-hub .jrtt-action {
    border-radius: var(--jr-interface-control-radius);
  }

  html.jr-soft-interface body.jr-portal.jr-quotes .quote-toolbar input,
  html.jr-soft-interface body.jr-portal.jr-quotes .quote-item-tools input,
  html.jr-soft-interface body.jr-portal.jr-request-page input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]),
  html.jr-soft-interface body.jr-portal.jr-request-page select,
  html.jr-soft-interface body.jr-portal.jr-request-page textarea,
  html.jr-soft-interface body.jr-portal.jr-orders .toolbar input,
  html.jr-soft-interface body.jr-portal.jr-orders .claim-form input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
  html.jr-soft-interface body.jr-portal.jr-orders .claim-form select,
  html.jr-soft-interface body.jr-portal.jr-orders .claim-form textarea,
  html.jr-soft-interface body.jr-portal.jr-settings input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]),
  html.jr-soft-interface body.jr-portal.jr-settings select,
  html.jr-soft-interface body.jr-portal.jr-settings textarea {
    border-radius: var(--jr-interface-control-radius);
  }

  html.jr-soft-interface body.jr-portal.jr-request-page .request-address-card,
  html.jr-soft-interface body.jr-portal.jr-request-page .request-edit-dialog,
  html.jr-soft-interface body.jr-portal.jr-request-page .entry-dialog,
  html.jr-soft-interface body.jr-portal.jr-request-page .sourcing-dialog,
  html.jr-soft-interface body.jr-portal.jr-request-page .leave-dialog,
  html.jr-soft-interface body.jr-portal.jr-orders .claims-box,
  html.jr-soft-interface body.jr-portal.jr-hub .jrtt .card,
  html.jr-soft-interface body.jr-portal.jr-settings .section,
  html.jr-soft-interface body.jr-portal.jr-quotes .quote-table-wrap {
    border-radius: var(--jr-interface-panel-radius);
  }

  /* The source request form/list cards and product rows intentionally remain
   * flat. Do not override their radius:0 rules or iframe shell padding. */
  html.jr-soft-interface body.jr-portal.jr-request-page .request-form-head {
    margin-bottom: 18px;
  }
  html.jr-soft-interface body.jr-portal.jr-request-page .request-edit-dialog h2 {
    margin-bottom: 14px;
  }
}

/* Keep existing compact mobile padding and layouts authoritative. */
@media screen and (min-width: 701px) {
  html.jr-soft-interface #shell #content .tool {
    padding: 22px;
  }
  html.jr-soft-interface #shell #content .brandcard {
    padding: 20px;
  }
  html.jr-soft-interface #shell #content .resource-guide-card {
    padding: 22px 24px;
  }
  html.jr-soft-interface #shell #content .doc-own-head {
    padding-top: 18px;
    padding-bottom: 14px;
  }
}

/* Approved existing-page refinement, Development round 2. */
/* Actual JR designer surfaces, round two. Presentation only; appended after
 * the shared layer. No state, content, DOM, payment or print behavior changes.
 * The Orders page is an iframe; its styles must be embedded through brandPage.
 */
@media screen {
  /* The real proposal/spec list is a group of articles, not a tablewrap. */
  html.jr-soft-interface #shell #content .jr-docs [data-list]:has(> .doc-row) {
    border: 1px solid #ddd7cf;
    border-radius: 12px;
    background: #fff;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-row {
    padding: 17px 20px;
    background: #fff;
    gap: 16px;
    border-top-color: #e5e0d8;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-row:first-child {
    border-top: 0;
    border-start-start-radius: 12px;
    border-start-end-radius: 12px;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-row:last-child {
    border-bottom: 0;
    border-end-start-radius: 12px;
    border-end-end-radius: 12px;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-row h3 {
    line-height: 1.45;
    overflow-wrap: anywhere;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-row p {
    margin: 5px 0 0;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-row > button {
    border-radius: 999px;
    padding: 8px 14px;
    background: #fff;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-list-toolbar {
    margin: 16px 0;
    gap: 16px;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-list-toolbar [data-search] {
    border: 0;
    border-bottom: 1px solid #bfb6a9;
    border-radius: 0;
    padding-inline: 4px;
    background: transparent;
  }

  /* Existing builder disclosures keep every original input and handler. */
  html.jr-soft-interface #shell #content .jr-docs .doc-compact-details {
    border: 1px solid #ddd7cf;
    border-radius: 12px;
    background: #fff;
    padding-inline: 18px;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-detail-section:first-child {
    border-top: 0;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-detail-section:last-child {
    border-bottom: 0;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-detail-section > summary {
    padding-block: 13px;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-detail-body {
    padding-bottom: 16px;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-menu > summary,
  html.jr-soft-interface #shell #content .jr-docs .doc-menu-body {
    border-radius: 9px;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-menu-body button {
    border-radius: 6px;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-room {
    margin-top: 20px;
    padding: 10px 16px;
    background: #eae5dc;
    color: #4f483e;
    border: 1px solid #ddd7cf;
    border-radius: 10px;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-item {
    border: 1px solid #e2dcd3;
    border-radius: 12px;
    margin-block: 7px;
    background: #fff;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-item-photo,
  html.jr-soft-interface #shell #content .jr-docs .doc-own-photo-preview {
    background: #fff;
    border-radius: 8px;
  }
  html.jr-soft-interface #shell #content .jr-docs .jr-selection-photo img {
    border-radius: 50%;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-client-unit p,
  html.jr-soft-interface #shell #content .jr-docs .doc-client-total p {
    color: #405f66;
    font-variant-numeric: tabular-nums;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-total {
    border: 1px solid #ddd7cf;
    border-radius: 12px;
    background: #fff;
    padding: 13px 18px;
    margin-top: 18px;
    font-variant-numeric: tabular-nums;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-total > div:last-child {
    color: #405f66;
  }

  /* Orders are generated inside jr_portal/index.js, outside the Hosting DOM. */
  html.jr-soft-interface body.jr-portal.jr-orders .portal-orders-table {
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #ddd7cf;
    border-radius: 12px;
    background: #fff;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-orders-table th {
    background: #eae5dc;
    padding-block: 12px;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-orders-table td {
    background: #fff;
    border-bottom-color: #e5e0d8;
    padding-block: 16px;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-orders-table thead tr:first-child th:first-child {
    border-start-start-radius: 11px;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-orders-table thead tr:first-child th:last-child {
    border-start-end-radius: 11px;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-orders-table tbody tr:last-child td {
    border-bottom: 0;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-orders-table tbody tr:last-child td:first-child {
    border-end-start-radius: 11px;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-orders-table tbody tr:last-child td:last-child {
    border-end-end-radius: 11px;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-order-open {
    border-radius: 999px !important;
    padding: 8px 14px !important;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .order-actions button,
  html.jr-soft-interface body.jr-portal.jr-orders .portal-pay {
    border-radius: 9px !important;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .toolbar input {
    border: 0 !important;
    border-bottom: 1px solid #bfb6a9 !important;
    border-radius: 0 !important;
    padding-inline: 4px !important;
    background: transparent !important;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-order-summary {
    border: 1px solid #ddd7cf;
    border-radius: 12px;
    padding: 18px 20px 16px;
    background: #fff;
    margin-top: 16px;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-order-metrics strong {
    font-variant-numeric: tabular-nums;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-order-metrics > div:first-child strong {
    color: #405f66;
    font-weight: 600;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-summary-secondary {
    margin-top: 15px;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-room-head {
    margin: 21px 0 9px;
    padding: 9px 14px;
    border: 1px solid #ddd7cf;
    border-radius: 10px;
    background: #eae5dc;
    color: #4f483e;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-room-head h3 {
    font-size: 15px;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-product-row {
    border: 1px solid #e2dcd3;
    border-radius: 12px;
    margin-block: 7px;
    background: #fff;
    padding-block: 18px;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-product-photo {
    border-radius: 8px;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-product-shipping > strong {
    color: #405f66;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .jr-selection-photo img {
    border-radius: 50%;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-order-notice {
    border: 1px solid #d4dfdf;
    border-radius: 10px;
    padding: 12px 16px;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-order-notice.warm {
    border-color: #ded1c1;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-project-more {
    border-radius: 12px;
  }

  /* Existing customer claim rows and catalog history, no new disclosure. */
  html.jr-soft-interface #shell #content #customer-claims {
    border: 1px solid #ddd7cf;
    border-radius: 12px;
    background: #fff;
  }
  html.jr-soft-interface #shell #content #customer-claims .claim-row:last-child {
    border-bottom: 0;
  }
  html.jr-soft-interface #shell #content .claim-row .claim-action,
  html.jr-soft-interface #shell #content .my-catalog .catalog-history-selection {
    border-radius: 8px;
  }
}

@media screen and (min-width: 701px) {
  html.jr-soft-interface #shell #content .jr-docs .doc-item {
    padding: 20px;
  }
}

/* Only a wide Orders iframe can safely put references beside the copy. At
 * narrower widths keep the proven source stacking and complete money column. */
@media screen and (min-width: 1100px) {
  html.jr-soft-interface body.jr-portal.jr-orders .portal-product-row {
    grid-template-columns: 78px minmax(365px, 1fr) minmax(110px, .28fr) 36px 155px;
    column-gap: 18px;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-product-info:has(> .jr-selection-photos) {
    display: grid;
    grid-template-columns: minmax(150px, 1fr) auto;
    column-gap: 22px;
    padding-right: 14px;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-product-info:has(> .jr-selection-photos) > :not(.jr-selection-photos) {
    grid-column: 1;
  }
  html.jr-soft-interface body.jr-portal.jr-orders .portal-product-info > .jr-selection-photos {
    grid-column: 2;
    grid-row: 1 / span 4;
    flex-wrap: nowrap;
    margin-top: 3px;
    gap: 10px;
  }
}

@media screen and (max-width: 650px) {
  html.jr-soft-interface body.jr-portal.jr-orders .portal-order-summary {
    padding-inline: 14px;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-row {
    padding: 15px;
    gap: 12px;
  }
  html.jr-soft-interface #shell #content .jr-docs .doc-compact-details {
    padding-inline: 14px;
  }
}

/* JR screen contrast and inset correction, Development round 2 follow-up. */
/* Narrow follow-up to the immutable round-two payload.
   Override legacy !important room-count ink and zero horizontal padding.
   Screen presentation only; data, visibility, interaction and print unchanged. */
@media screen {
  /* workspace-appearance.css otherwise leaves white counts on the new bone band. */
  html.jr-soft-interface .quote-room small,
  html.jr-soft-interface body.jr-portal.jr-orders .portal-room-head small {
    color: #655d51 !important;
  }

  /* The original aligned-summary rule uses padding:12px 0 !important.
     Keep a compact, visible inset inside the new rounded border. */
  html.jr-soft-interface #summary.quote-aligned-summary {
    padding: 16px 18px !important;
    margin: 16px 0 !important;
  }

  /* The original ID-specific rule otherwise retains a heavy two-pixel top edge. */
  html.jr-soft-interface #totals.quote-aligned-totals {
    border: 1px solid #ddd7cf;
    padding: 12px 16px;
  }
}

@media screen and (max-width: 560px) {
  html.jr-soft-interface #summary.quote-aligned-summary {
    padding: 14px !important;
  }
}

/* JR search and project-reference presentation, Development round 3. */
/* A decorative background on existing search controls. No input, event,
   clear-button, label, focus, autocomplete or disabled behavior changes. */
@media screen {
  html.jr-soft-interface input:is(
    [type="search"],
    .search:not([type]),
    .search[type="text"],
    [placeholder^="Search " i]:not([type]),
    [placeholder^="Search " i][type="text"],
    [placeholder^="Find " i]:not([type]),
    [placeholder^="Find " i][type="text"]
  ):not(.has-search-icon):not([data-has-search-icon]) {
    background-image: url("jr-search.svg") !important;
    background-repeat: no-repeat !important;
    background-position: 11px center !important;
    background-size: 16px 16px !important;
    padding-left: 34px !important;
  }
  /* Replace the optional native magnifier, keeping the native clear control. */
  html.jr-soft-interface input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
  }
}

/* Existing project-label nodes only. Names, labels and record fields are
   preserved. Inline blocks let the whole reference move below the name. */
@media screen {
  html.jr-soft-interface .project-extra:not([hidden]) {
    display: inline-block !important;
    max-width: 100%;
    font-size: .9em !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: #776e63 !important;
    line-height: 1.45;
    white-space: normal !important;
    overflow-wrap: anywhere;
    vertical-align: baseline;
  }
  html.jr-soft-interface body.jr-portal.jr-orders #order-title > .project-extra:not([hidden]),
  html.jr-soft-interface #detail #project > .project-extra:not([hidden]),
  html.jr-soft-interface #shell #content .pagehead h1 > .project-extra:not([hidden]),
  html.jr-soft-interface #main .order-work-heading h1 > .project-extra:not([hidden]),
  html.jr-soft-interface #main .recovered-record-heading h1 > .project-extra:not([hidden]) {
    display: inline-block !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    margin: 0 0 0 10px !important;
    max-width: 100%;
  }
  html.jr-soft-interface #main .order-work-heading > div:first-child {
    flex: 1;
    min-width: 0;
  }
  html.jr-soft-interface #main .recovered-record-heading h1 {
    min-width: 0;
  }
  html.jr-soft-interface #edit-view .quote-project-title #quote-label:not([hidden]) {
    display: inline-block !important;
    flex: 0 1 auto;
    max-width: 100%;
    margin: 0 !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    color: #776e63;
    line-height: 1.45;
    overflow-wrap: anywhere;
  }
  html.jr-soft-interface :is(#main, #list-view) .queue-project > strong {
    display: inline;
  }
  html.jr-soft-interface :is(#main, #list-view) .queue-project > .queue-project-label:not([hidden]) {
    display: inline-block !important;
    max-width: 100%;
    margin: 0 0 0 8px !important;
    font-size: .9em;
    font-weight: 400;
    color: #776e63;
    line-height: 1.45;
    white-space: normal;
    overflow-wrap: anywhere;
    vertical-align: baseline;
  }
}
@media screen and (max-width: 700px) {
  html.jr-soft-interface body.jr-portal.jr-orders #order-title > .project-extra,
  html.jr-soft-interface #detail #project > .project-extra,
  html.jr-soft-interface #shell #content .pagehead h1 > .project-extra,
  html.jr-soft-interface #main .order-work-heading h1 > .project-extra,
  html.jr-soft-interface #main .recovered-record-heading h1 > .project-extra,
  html.jr-soft-interface #edit-view .quote-project-title #quote-label {
    font-size: 16px !important;
  }
}



/* JR approved payment-row presentation 20261022 */
@media screen {
  html.jr-soft-interface .ledger-detail-row > td { padding: 0 22px 18px !important; }
  html.jr-soft-interface .ledger-detail-row .ledger-detail { margin: 0; padding: 16px 0 0; border-top: 1px solid #ded9d0; }
  html.jr-soft-interface [data-ledger="details"],html.jr-soft-interface [data-ledger="balance"] { border-radius: 999px; white-space: nowrap; }
  html.jr-soft-interface [data-ledger][aria-expanded="true"] { background: #e9e5dc; border-color: #c9bfae; }
  html.jr-soft-interface .staff-ledger-table .ledger-record-name { display: block; font-weight: 600; }
  html.jr-soft-interface .staff-ledger-table small { display: block; margin-top: 4px; color: #776e63; }
  html.jr-soft-interface .staff-ledger-table .ledger-detail-row small { display: inline; }
  html.jr-soft-interface .staff-ledger-tabs { display: flex; width: max-content; gap: 3px; border-radius: 999px; padding: 4px; background: #eae7df; margin: 16px 0; }
  html.jr-soft-interface .staff-ledger-tabs a { border: 0; border-radius: 999px; padding: 8px 17px; text-decoration: none; }
  html.jr-soft-interface .staff-ledger-tabs a[aria-current="page"] { background: #fff; box-shadow: 0 1px 4px #352e2012; }
  html.jr-soft-interface .staff-ledger-detail { padding: 17px 0 0; border-top: 1px solid #ded9d0; }
  html.jr-soft-interface .ledger-reference-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(160px,1fr)); gap: 12px 24px; margin-bottom: 18px; }
  html.jr-soft-interface .ledger-reference-grid dt { color: #776e63; font-size: 11px; }
  html.jr-soft-interface .ledger-reference-grid dd { margin: 3px 0 0; overflow-wrap: anywhere; }
  html.jr-soft-interface .ledger-allocation { display: flex; gap: 18px; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid #e8e3da; }
  html.jr-soft-interface .ledger-allocation:last-child { border-bottom: 0; }
  html.jr-soft-interface .ledger-expansion-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 14px; }
}


/* Approved Overview follow-through. Screen only; every existing node stays. */
@media screen {
  html.jr-soft-interface #shell #content:has(> #next-steps) > .metrics {
    border: 1px solid #ded9d0;
    border-radius: 16px;
    background: #fff;
    padding: 16px 20px;
    margin-bottom: 22px;
  }
  html.jr-soft-interface #shell #content #next-steps,
  html.jr-soft-interface #shell #content #am-updates .rows {
    border: 1px solid #ded9d0;
    border-radius: 16px;
    background: #fff;
  }
  html.jr-soft-interface #shell #content #next-steps > .attention-group:first-child > h3 {
    border-start-start-radius: 15px;
    border-start-end-radius: 15px;
  }
  html.jr-soft-interface #shell #content #next-steps > .attention-group:last-child > :last-child,
  html.jr-soft-interface #shell #content #am-updates .rows > :last-child {
    border-end-start-radius: 15px;
    border-end-end-radius: 15px;
    border-bottom: 0;
  }
  html.jr-soft-interface #shell #content:has(> #next-steps) > .editorial {
    border-radius: 16px;
    margin-top: 18px;
  }
  html.jr-soft-interface #shell #content:has(> #next-steps) > .split {
    gap: 16px;
  }
  html.jr-soft-interface #shell #content:has(> #next-steps) > .split > section {
    border: 1px solid #ded9d0;
    border-radius: 16px;
    background: #fff;
    padding: 14px 16px;
    min-width: 0;
  }
  html.jr-soft-interface #shell #content .jr-announcement {
    border-radius: 12px;
  }
  html.jr-soft-interface #shell #content .jr-announcement img {
    border-radius: 8px;
  }
  @media (max-width: 650px) {
    html.jr-soft-interface #shell #content:has(> #next-steps) > .metrics {
      padding: 14px 12px;
    }
  }
}

/* JR Room / Group: optional text labels and compact explanation only. */
@media screen {
  .jr-room-field { position: relative; min-width: 0; }
  .jr-room-field > label { display: block; margin: 0; }
  .jr-room-title { display: block; padding-right: 24px; font-weight: 600; color: #66553d; }
  .jr-room-field > label > input, .jr-room-field > label > select,
  .catalog-selected input[data-room] { border-color: #c9bca7; background-color: #fffdf8; }
  .jr-room-info { position: absolute; top: 0; right: 0; margin: 0; z-index: 4; }
  .jr-room-info[open] { z-index: 40; }
  .jr-room-info > summary { display: grid; place-items: center; width: 17px; height: 17px; padding: 0; margin: 0; border: 1px solid #ad9c82; border-radius: 50%; background: #f7f2e8; color: #66553d; font: 600 11px/1 Georgia, serif; cursor: pointer; list-style: none; }
  .jr-room-info > summary::-webkit-details-marker { display: none; }
  .jr-room-info > summary::before, .jr-room-info > summary::after { content: none; }
  .jr-room-info > summary:focus-visible { outline: 2px solid #806c4d; outline-offset: 3px; }
  .jr-room-info > p { position: absolute; top: 22px; right: 0; width: min(250px, calc(100vw - 48px)); padding: 9px 11px; margin: 0; border: 1px solid #cfc3b1; border-radius: 8px; background: #fffdf8; color: #443d34; box-shadow: 0 3px 12px #25252516; font: 400 12px/1.45 Arial, sans-serif; text-align: left; text-transform: none; letter-spacing: normal; }
  .jr-room-field > label > input:focus, .jr-room-field > label > select:focus { outline-offset: 1px; }
  .side-panel .field-grid > .jr-room-field { grid-column: 1 / -1; }
}
@media screen and (max-width: 700px) {
  .item-editor-compact > .jr-room-field { grid-column: 1 / -1; }
}
@media screen and (max-width: 650px) {
  .jr-room-info > p { position: fixed; top: auto; left: 16px; right: 16px; width: auto; margin-top: 5px; }
}

/* Approved room groups: bone headers, white joined rows, shared edges. */
@media screen {
 /* Spec sheets and proposals use the same group shell as Trade Quotes. */
 html.jr-soft-interface .jr-docs .doc-room{background:#eae6de!important;color:#51483f!important;border:1px solid #ded9d0!important;border-radius:12px 12px 0 0!important;margin:20px 0 0!important;padding:10px 16px!important;font-weight:600}
 html.jr-soft-interface .jr-docs .doc-item{background:#fff!important;border:1px solid #ded9d0!important;border-top:0!important;border-radius:0!important;margin:0!important}
 html.jr-soft-interface .jr-docs .doc-item:has(+.doc-room),html.jr-soft-interface .jr-docs .doc-item:last-child{border-radius:0 0 12px 12px!important}
 /* Native purchase and invoice worksheets retain their controls and density. */
 html.jr-soft-interface #main .restored-worksheet .order-group{margin:20px 0 0!important;border:1px solid #ded9d0!important;border-radius:12px!important;overflow:hidden;background:#fff}
 html.jr-soft-interface #main .restored-worksheet .room-bar{margin:0!important;padding:10px 16px!important;border:0!important;border-bottom:1px solid #ded9d0!important;border-radius:0!important;background:#eae6de!important;color:#51483f!important;font-size:12px;font-weight:600}
 html.jr-soft-interface #main .restored-worksheet .staff-product{margin:0!important;border:0!important;border-radius:0!important;background:#fff}
 html.jr-soft-interface #main .restored-worksheet .staff-product+.staff-product{border-top:1px solid #ded9d0!important}
 html.jr-soft-interface :is(#items>.quote-room,body.jr-portal.jr-orders #items>.portal-room-head,#edit-view #items>.room){background:#eae6de!important;color:#51483f!important;border:1px solid #ded9d0!important;border-radius:12px 12px 0 0!important;margin:20px 0 0!important;padding:10px 16px!important;font-weight:600;min-width:0}
 html.jr-soft-interface :is(#items>.quote-room,#items>.portal-room-head) :is(h3,small){color:#51483f!important}
 html.jr-soft-interface :is(#items>.quote-product,body.jr-portal.jr-orders #items>.portal-product-row,#edit-view #items>.item-block){background:#fff!important;border:1px solid #ded9d0!important;border-top:0!important;border-radius:0!important;margin:0!important;overflow:hidden}
 html.jr-soft-interface :is(#items>.quote-product:has(+.quote-room),#items>.quote-product:last-child,#items>.portal-product-row:has(+.portal-room-head),#items>.portal-product-row:last-child,#edit-view #items>.item-block:has(+.room),#edit-view #items>.item-block:last-child){border-radius:0 0 12px 12px!important}
 html.jr-soft-interface #edit-view #items>.quote-read-columns{border:1px solid #ded9d0;border-radius:12px;background:#f0ede7;color:#61584e;padding:12px 16px}
 html.jr-soft-interface #main.consolidated-order .order-compact-table{padding:0;border:0;border-radius:0;background:transparent}
 html.jr-soft-interface #main.consolidated-order .order-items .order-table-head{margin:0;border:1px solid #ded9d0;border-radius:12px;background:#f0ede7;color:#61584e;padding-left:16px;padding-right:16px}
 html.jr-soft-interface #main.consolidated-order .order-items .order-group{margin:20px 0 0;border:1px solid #ded9d0;border-radius:12px;overflow:hidden;background:#fff}
 html.jr-soft-interface #main.consolidated-order .order-items .room-bar{margin:0;padding:10px 16px;border:0;border-bottom:1px solid #ded9d0;border-radius:0;background:#eae6de;color:#51483f;font-size:12px;font-weight:600}
 html.jr-soft-interface #main.consolidated-order .order-items .staff-product{margin:0;border:0;border-radius:0;background:#fff;overflow:hidden}
 html.jr-soft-interface #main.consolidated-order .order-items .staff-product+.staff-product{border-top:1px solid #ded9d0}
 html.jr-soft-interface #main.consolidated-order .order-item-progress{padding-bottom:14px}
 html.jr-soft-interface :is(.quote-read-edit,[data-edit-order-item]){border-radius:999px!important;padding:6px 14px!important;font-weight:500!important;line-height:1.5!important}
 html.jr-soft-interface .shipment-expanded-meta{border:1px solid #ded9d0;border-radius:12px;overflow:hidden;background:#f0ede7}
 html.jr-soft-interface .shipment-expanded-footer>div{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px 14px}
 html.jr-soft-interface .shipment-expanded-footer .shipment-text-action{display:inline-flex;align-items:center;justify-content:center;border:1px solid #cfc7ba!important;border-radius:999px!important;padding:8px 16px!important;background:#fff;color:#252525;text-decoration:none!important;font-weight:500;line-height:1.5}
 html.jr-soft-interface .shipment-expanded-footer button{border:0!important;border-radius:999px!important;padding:8px 12px!important;background:transparent;color:#665b4c;text-decoration:none!important;font-weight:400;line-height:1.5}
 html.jr-soft-interface .shipment-expanded-footer :is(a,button):hover{background:#f0ede7}
 html.jr-soft-interface .shipment-expanded-footer :is(a,button):focus-visible{outline:2px solid #806a45;outline-offset:3px}
 /* Keep the Room help with its field through the native Add/Find mode switch. */
 html.jr-soft-interface .quote-item-editor .item-editor-compact{grid-template-columns:minmax(90px,1fr) 60px 60px minmax(115px,1.2fr) minmax(150px,1.3fr);align-items:start}
 html.jr-soft-interface .quote-item-editor .item-editor-compact>.jr-room-field{grid-column:auto;min-width:0}
 html.jr-soft-interface .catalog-correction-entry{display:flex;justify-content:flex-end;margin:0;padding-top:8px}
 html.jr-soft-interface .catalog-correction-entry button{border:1px solid #cfc7ba;border-radius:999px;padding:6px 12px;background:white;text-decoration:none;font-size:11px}
 html.jr-soft-interface :is(dialog#dialog,.catalog-correction-dialog){background:#fff;border-radius:16px;border-color:#ded9d0}
 html.jr-soft-interface dialog#dialog .dialog-head{background:#fff}
 html.jr-soft-interface .quote-item-editor :is(input:not([type=checkbox]),select,textarea){border-radius:8px}
 @media(max-width:800px){html.jr-soft-interface .quote-item-editor .item-editor-compact{grid-template-columns:minmax(0,1fr) 60px 60px}html.jr-soft-interface .quote-item-editor .item-editor-compact>label:has(input[name=size]){grid-column:1}html.jr-soft-interface .quote-item-editor .item-editor-compact>.jr-room-field{grid-column:2/-1}}
 @media(max-width:480px){html.jr-soft-interface .quote-item-editor .item-editor-compact{grid-template-columns:1fr 1fr}html.jr-soft-interface .quote-item-editor .item-editor-compact>.jr-room-field{grid-column:1/-1}html.jr-soft-interface .quote-item-editor .item-editor-compact>label:has(input[name=size]){grid-column:2}}
}

/* Claims filters need breathing room above their results. */
@media screen { html.jr-soft-interface #shell #claim-tabs { margin-bottom: 18px !important; } }

/* Rounded popup scrollbars remain inside the surface without changing its scroll owner. */
@media screen {
 :is(dialog,[role="dialog"]) {overscroll-behavior:contain}
 :is(dialog,[role="dialog"]), :is(dialog,[role="dialog"]) * {scrollbar-color:#aaa69e transparent}
 @supports selector(::-webkit-scrollbar) {
  :is(dialog,[role="dialog"]), :is(dialog,[role="dialog"]) * {scrollbar-width:auto}
  :is(dialog,[role="dialog"])::-webkit-scrollbar, :is(dialog,[role="dialog"]) *::-webkit-scrollbar {width:10px;height:10px;background:transparent}
  :is(dialog,[role="dialog"])::-webkit-scrollbar-track {margin-block:18px;background:transparent;border-radius:20px}
  :is(dialog,[role="dialog"]) *::-webkit-scrollbar-track {margin-block:8px;background:transparent;border-radius:20px}
  :is(dialog,[role="dialog"])::-webkit-scrollbar-thumb, :is(dialog,[role="dialog"]) *::-webkit-scrollbar-thumb {background:#aaa69e;border:3px solid transparent;background-clip:padding-box;border-radius:20px}
  :is(dialog,[role="dialog"])::-webkit-scrollbar-button, :is(dialog,[role="dialog"]) *::-webkit-scrollbar-button {display:none;width:0;height:0}
  :is(dialog,[role="dialog"])::-webkit-scrollbar-corner, :is(dialog,[role="dialog"]) *::-webkit-scrollbar-corner {background:transparent}
 }
 @media (forced-colors:active) {:is(dialog,[role="dialog"]),:is(dialog,[role="dialog"]) * {scrollbar-color:auto;scrollbar-width:auto}}
}