/* DOC-7200: native Dock product views, inside the Home's browser and tab stage.
   Desktop tab geometry is inherited from home.css (1712 / 396 / 1292). */
.order-forms-page{overflow-x:clip}
.order-forms-page .sp-hero-right{padding:0}
.order-forms-page .sp-hero-title{max-width:650px}
.of-section-head{padding:0 48px;max-width:1200px;margin-bottom:48px}
.of-section-head .ds-h2{margin:0}
.of-section-head>p{margin:20px 0 0;max-width:950px}
.of-hero-tabs{display:flex;gap:24px;margin-top:32px;flex-wrap:wrap}
.of-hero-tabs button{position:relative;border:0;padding:0 0 12px;background:none;color:var(--ds-ink-50);font:500 16px/24px var(--ds-font);cursor:pointer}
.of-hero-tabs button::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--ds-ring-color,transparent)}
.of-hero-tabs [aria-selected=true]{color:var(--ds-ink)}
.of-hero-tabs [aria-selected=true]::after{background:var(--ds-sky)}
.of-hero-tabs button:focus-visible,.of-tabs button:focus-visible{outline:2px solid var(--ds-blue);outline-offset:5px}
.of-hero-panel{width:100%;height:100%;position:relative;z-index:1}
.of-hero-panel[hidden],.of-tab-panel[hidden]{display:none}
.of-tabs .sl-tab>button{display:block;width:100%;border:0;padding:0;background:none;font:500 24px/32px var(--ds-font);color:var(--ds-ink-50);text-align:left;cursor:pointer}
.of-tabs .sl-tab.is-active>button,.of-tabs .sl-tab>button:hover{color:var(--ds-ink)}
.of-tabs .ts-rail .sl-tab::after{top:11px}
.of-tabs .ts-rail .sl-tab.is-active::after{top:10px;--tabp:100}
.of-tabs .ts-rail .sl-tab .ts-desc{max-width:100%;width:318px}
.of-tab-panel{position:absolute;inset:0;z-index:1}
.of-art{position:relative;width:100%;height:100%;overflow:hidden;isolation:isolate;user-select:none;min-width:0;--ofs:1;--of-width:1000px;--of-height:736px}
.of-scene{position:absolute;left:22px;top:22px;width:var(--of-width);height:var(--of-height);transform:scale(var(--ofs));transform-origin:top left;color:var(--ds-ink);font:400 14px/20px var(--ds-font);text-align:left}
.of-window{position:relative;width:100%;height:100%;display:flex;flex-direction:column;background:var(--ds-surface-gray);border-radius:12px;overflow:clip;isolation:isolate;box-shadow:0 7px 9px #0000000a}
.of-window::after{content:'';position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 .5px #0000001a;pointer-events:none;z-index:10}
/* sl-chrome and sl-urlbar are copied from Home. Their CSS is never redefined here. */
.of-window>.sl-chrome,.of-window>.sl-urlbar{flex:none}
.of-screen{position:relative;flex:1;min-height:0;overflow:hidden;background:var(--ds-white);border:0.5px solid #ebe5d8;border-radius:6px;margin:2px}
.of-tabs .of-art{--of-width:1248px;--of-height:736px}
.of-art--hero{--of-width:860px;--of-height:790px;min-height:740px}
.of-art--hero .of-scene{left:24px;top:40px}
.of-ai-feature,.of-signature-feature{height:780px;border-radius:var(--ds-radius-md);overflow:hidden;background:var(--ds-blue) url('../assets/img/figma/stage-symbol.svg') 45% 44% / 2400px auto}
.of-ai-feature .of-art,.of-signature-feature .of-art{--of-width:1602px;--of-height:736px}
.of-ai-feature .of-scene,.of-signature-feature .of-scene{left:50%;transform:translateX(-50%) scale(var(--ofs));transform-origin:top center}
.of-ai-clients{display:flex;align-items:center;gap:28px;padding:28px 48px;flex-wrap:wrap;font-size:18px}
.of-ai-clients>span{display:flex;align-items:center;gap:10px}
.of-ai-clients img{width:24px;height:24px;object-fit:contain}
.of-ai-clients>a{margin-left:auto;display:flex;align-items:center;gap:10px;color:var(--ds-ink);text-underline-offset:4px}
.of-pricing-grid,.of-signature-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.of-capability{padding:48px}
.of-capability>.of-icon{width:32px;height:32px;margin-bottom:24px}
.of-capability ul,.of-integration ul{list-style:none;padding:0;margin:24px 0 0}
.of-capability li,.of-integration li{display:flex;gap:12px;align-items:center;font:400 18px/28px var(--ds-font);margin-bottom:12px}
.of-standalone,.of-integration{display:grid;grid-template-columns:1fr 1.6fr;gap:0;margin-top:24px;padding:0;overflow:hidden}
.of-standalone>div:first-child,.of-integration-copy{padding:48px}
.of-standalone>.of-art{height:480px}
.of-soon{display:inline-block;border-radius:20px;background:var(--ds-surface-chip);color:var(--ds-ink-50);font:400 12px/18px var(--ds-font);padding:4px 10px;vertical-align:middle;white-space:nowrap}
.of-standalone .ds-card-title{margin-top:16px}
.of-signature-cards{margin-top:24px}
.of-feature-card{padding:0;overflow:hidden;display:flex;flex-direction:column}
.of-card-copy{padding:48px 48px 28px;flex:1}
.order-forms-page .ds-card-title{font:500 24px/32px var(--ds-font);margin:0}
.order-forms-page .ds-card-body{font:400 18px/28px var(--ds-font);margin:16px 0 0}
.of-art--small{height:300px;flex:none;--of-width:600px;--of-height:450px}
.of-art--small .of-scene{left:24px;top:8px}
.of-integration{margin-top:0}
.of-integration-logos{display:flex;gap:24px;margin-bottom:32px}
.of-integration-logos img{width:64px;height:56px;object-fit:contain}
.of-integration a{display:inline-block;margin-top:16px;color:var(--ds-ink)}
.of-integration .of-art{min-height:580px}
.of-final-cta{padding:0 48px;display:flex;gap:12px}

/* Shared product atoms. */
.of-scene * { box-sizing:border-box; }
.of-scene h2,.of-scene h3,.of-scene h4,.of-scene p { margin:0; }
.of-scene h2 { font:500 26px/34px var(--ds-font); }
.of-scene h3 { font:500 18px/26px var(--ds-font); }
.of-scene h4 { font:500 15px/22px var(--ds-font);margin:24px 0 12px; }
.of-scene b { font-weight:500; }
.of-scene small { font-size:12px;line-height:18px; }
.of-icon { width:16px;height:16px;object-fit:contain;flex:none; }
.of-avatar { width:26px;height:26px;object-fit:cover;border-radius:50%;flex:none; }
.of-wordmark { width:76px;height:20px;object-fit:contain; }
.of-mark { width:23px;height:18px;object-fit:contain; }
.of-ui-btn { display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;min-height:32px;padding:6px 12px;border-radius:5px;background:var(--ds-white);box-shadow:var(--ds-shadow-btn);border:1px solid #e7e7e7;font-size:12px;line-height:18px; }
.of-ui-btn.of-primary { color:var(--ds-white);background:var(--ds-blue);border-color:var(--ds-blue);box-shadow:var(--ds-shadow-btn),var(--ds-shadow-btn-primary-inset); }
.of-primary .of-icon { filter:brightness(0) invert(1); }
.of-ui-actions { display:flex;align-items:center;gap:8px;margin-left:auto; }
.of-ui-top { height:48px;display:flex;align-items:center;gap:12px;padding:8px 16px;border-bottom:1px solid #ececec;background:var(--ds-white); }
.of-muted { color:var(--ds-ink-50); }
.of-blue { color:var(--ds-blue); }
.of-pill { display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:12px;background:#f3f4f5;color:var(--ds-ink-50);font-size:11px;line-height:17px;white-space:nowrap; }
.of-green { color:#408065;background:#eaf4ec; }
.of-violet { color:#7060b0;background:#f0ecf7; }
.of-amber { color:#a57530;background:#fff5e3; }
.of-push { flex:1; }
.of-pad { padding:24px; }
.of-search { display:flex;align-items:center;gap:8px;border:1px solid #e1e1e1;border-radius:5px;height:36px;padding:8px 12px;color:var(--ds-ink-50);background:var(--ds-surface-tint);min-width:180px; }
.of-search .of-icon:last-child { margin-left:auto; }
.of-filter-row { display:flex;align-items:center;gap:10px;margin:20px 0; }
.of-filter-row > .of-ui-btn:last-child { margin-left:auto; }
.of-count { text-align:right;margin-top:16px;font-size:12px; }
.of-table { border-collapse:collapse;width:100%;font-size:13px;line-height:20px;table-layout:auto; }
.of-table th { text-align:left;font-weight:400;color:var(--ds-ink-50);font-size:12px;padding:10px 12px;border-bottom:1px solid #ddd;white-space:nowrap; }
.of-table td { padding:13px 12px;border-bottom:1px solid #e9e9e9;vertical-align:middle; }
.of-table td:last-child,.of-table th:last-child { text-align:right; }
.of-table td + td { border-left:1px solid #f1f1f1; }
.of-table tbody tr { background:var(--ds-white); }
.of-table small { display:block;color:var(--ds-ink-50);font-size:11px;line-height:16px;margin-top:6px; }
.of-product-name { display:flex;align-items:center;gap:8px;white-space:nowrap; }
.of-product-name > b { display:grid;place-items:center;width:25px;height:25px;border-radius:5px;background:#ece9f4;color:#7060b0;font-size:10px; }
.of-checkbox { width:12px;height:12px;border:1px solid #bbb;border-radius:3px; }
.of-doc-row { display:flex;align-items:center;gap:12px;padding:16px 0;border-bottom:1px solid #ececec; }
.of-doc-row .of-pill { margin-left:auto; }
.of-doc-row small { display:block;color:var(--ds-ink-50); }
.of-textarea { padding:16px;border:1px solid #e1e1e1;border-radius:5px;background:var(--ds-white);min-height:100px; }
.of-textarea p { margin-top:8px; }
/* Chrome and Dock shell */
.of-app { display:flex;min-height:610px; }
.of-sidebar { width:148px;flex:none;border-right:1px solid #e9e9e9;padding:20px 10px;background:var(--ds-white); }
.of-sidebar > img { margin:0 12px 28px; }.of-sidebar p { margin:0 12px 8px;font-size:11px; }
.of-sidebar > span { display:flex;gap:8px;align-items:center;font-size:12px;padding:9px 12px; }
.of-sidebar .is-selected { background:#f5f5f5; }.of-sidebar small { display:block;margin:240px 12px 0;color:var(--ds-ink-50); }
.of-app-main { flex:1;min-width:0; }
.of-settings-tabs { display:flex;align-items:center;height:42px;background:var(--ds-surface-tint);border-bottom:1px solid #ececec;padding:0 20px;gap:0; }
.of-settings-tabs > span { height:42px;display:flex;align-items:center;padding:0 16px;font-size:12px;border-left:1px solid #ececec; }
.of-settings-tabs .is-selected { background:var(--ds-white);border-bottom:1px solid white; }
.of-settings-body { max-width:680px;margin:32px auto;padding:0 24px; }
.of-settings-body > .of-muted { margin-top:8px; }
.of-term-options { display:flex;flex-direction:column;gap:5px; }.of-term-options span{display:flex;gap:8px}.of-term-options i{font-style:normal;color:var(--ds-blue)}.of-term-options em{font-style:normal;font-size:11px;color:#67987a}
.of-switch { display:block;background:var(--ds-blue);width:28px;height:16px;border-radius:12px; }.of-switch::after{content:"";display:block;width:12px;height:12px;border-radius:50%;background:var(--ds-white);transform:translate(14px,2px)}
.of-rule { padding:24px;border:1px solid #e0e0e0;border-radius:10px;background:var(--ds-surface-tint);margin-top:24px; }
.of-rule-fields { display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:16px; }.of-input{display:flex;justify-content:space-between;width:90px;border:1px solid #ddd;padding:6px 10px;background:var(--ds-white);border-radius:5px}.of-input em{font-style:normal;color:var(--ds-ink-50)}
.of-rule-add { display:block;margin-top:16px;color:var(--ds-blue); }.of-rule-line{height:30px;border-left:1px solid #ddd;margin-left:32px;margin-bottom:-24px}
/* Quote editor: white cells, in-line controls, right-hand AI panel. */
.of-quote-layout { display:flex;min-height:670px;background:var(--ds-surface-tint); }
.of-quote-sheet { margin:20px;padding:20px;flex:1;min-width:0;border:1px solid #e0e0e0;border-radius:6px;background:var(--ds-white); }
.of-option-tabs { display:flex;gap:20px;border-bottom:1px solid #e0e0e0;font-size:12px;min-height:38px; }
.of-option-tabs span { padding:6px 10px 12px; }.of-option-tabs .is-selected{color:var(--ds-blue);border-bottom:2px solid var(--ds-blue)}
.of-quote-table { table-layout:fixed; }.of-quote-table th:first-child{width:35%}.of-quote-table th:nth-child(2){width:12%}.of-quote-table th:nth-child(3){width:17%}.of-quote-table th:nth-child(4){width:18%}
.of-quote-table td { background:var(--ds-surface-tint);padding:8px 5px;vertical-align:top;border-left:0!important; }
.of-cell-edit { display:block;border:1px solid #e1e1e1;padding:5px 8px;border-radius:4px;background:#fff;white-space:nowrap; }
.of-add-line { padding:10px;color:var(--ds-blue);background:var(--ds-surface-tint);border-bottom:1px solid #eee;font-size:12px; }
.of-totals { width:260px;margin:16px 0 0 auto;border:1px solid #e0e0e0;border-radius:6px;overflow:hidden; }
.of-totals p { display:flex;justify-content:space-between;padding:9px 12px;font-size:13px; }.of-totals .of-total{border-top:1px solid #ddd;background:var(--ds-surface-tint);padding:14px 12px}
.of-quote-terms { display:flex;gap:28px;font-size:11px;color:var(--ds-ink-50); }.of-quote-terms span{flex:1}.of-quote-terms b{display:block;color:var(--ds-ink);font-size:12px;margin-top:6px}
.has-ai .of-quote-sheet { margin:16px;padding:16px; }.has-ai .of-quote-table th{font-size:10px;padding-left:4px;padding-right:4px}.has-ai .of-cell-edit{font-size:11px;padding:5px}.has-ai .of-quote-table small{font-size:10px}.has-ai .of-pill{font-size:9px;padding:2px 5px}
.of-ai-panel { width:300px;flex:none;border-left:1px solid #ddd;background:#fff;position:relative; }
.of-ai-head { display:flex;align-items:center;gap:8px;height:48px;padding:16px;border-bottom:1px solid #eee;font-weight:500; }.of-ai-head img:last-child{margin-left:auto}
.of-ai-content { padding:18px;font-size:13px;line-height:20px; }.of-ai-content > p{margin-bottom:18px}.of-ai-content .of-user-msg{padding:12px;background:#f7f7f7;border-radius:12px;margin-left:12px}
.of-ai-changes { border:1px solid #ddd;border-radius:8px;padding:14px; }.of-ai-changes > small{color:var(--ds-ink-50);font-size:10px;letter-spacing:.04em}.of-ai-changes p{display:flex;justify-content:space-between;margin-top:12px;font-size:12px}.of-ai-changes > div{display:flex;gap:8px;margin-top:18px}
.of-ai-composer { position:absolute;bottom:20px;left:14px;right:14px;padding:12px;border:1px solid #ddd;border-radius:12px;background:var(--ds-white);font-size:11px;color:var(--ds-ink-50); }.of-ai-composer > div{display:flex;justify-content:space-between;align-items:center;margin-top:22px}.of-ai-composer b{display:grid;place-items:center;background:var(--ds-blue);color:var(--ds-white);width:25px;height:25px;border-radius:50%;font-size:18px}
.of-overlay { position:absolute;inset:67px 0 0;background:#12172238; }.of-overlay--light{background:#12172218}
.of-product-modal { position:absolute;width:480px;top:110px;left:260px;background:var(--ds-white);padding:24px;border-radius:12px;box-shadow:0 7px 9px #0000000a; }
.of-product-modal h3,.of-sign-modal h3,.of-filter-popover h3 { display:flex;justify-content:space-between;margin-bottom:24px; }.of-product-modal > .of-search{border-color:#97baff;background:var(--ds-white);margin-bottom:20px}
.of-library-product { display:flex;align-items:center;gap:12px;padding:14px;border:1px solid #e9e9e9;border-radius:9px;margin-top:10px; }.of-library-product > .of-icon{width:30px;height:30px;padding:7px;background:#f2f0fa;border-radius:5px}.of-library-product b{font-size:13px}.of-library-product .of-pill{font-size:9px;margin-left:8px}.of-library-product p{font-size:11px;color:var(--ds-ink-50);margin:4px 0}.of-library-product small{color:var(--ds-ink-50)}.of-library-product > span{margin-left:auto;color:var(--ds-ink-50)}
.of-edit-note { position:absolute;right:34px;top:550px;background:var(--ds-white);border:1px solid #ddd;border-radius:6px;display:flex;align-items:center;gap:8px;padding:10px;font-size:12px; }
/* Buyer-facing documents and signature dialog */
.of-form-paper { margin:28px 60px;padding:30px;background:var(--ds-white);border:1px solid #eee;border-radius:4px; }
.of-form-brand { display:flex;align-items:center;margin-bottom:20px; }.of-form-brand img{width:36px;height:36px;border-radius:50%;margin-right:-5px}
.of-form-parties { display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:25px;margin:28px 0; }.of-form-parties p{font-size:12px;line-height:19px;margin-top:5px}.of-form-parties small{color:var(--ds-ink-50)}
.of-signature-row { display:flex;align-items:center;justify-content:space-between;gap:28px;margin-top:32px; }.of-signature-row em{font:italic 32px/40px Georgia,serif;display:block}.of-signature-row p{font-size:11px;color:var(--ds-ink-50);margin-top:8px}
.of-sign-modal { position:absolute;left:300px;top:260px;width:500px;padding:24px;background:var(--ds-white);border-radius:10px;box-shadow:0 7px 9px #0000000a; }
.of-sign-tabs { display:flex;gap:32px;justify-content:center;padding:0 0 18px;border-bottom:1px solid #eee;margin-bottom:20px; }.of-sign-tabs img{width:20px;height:20px}.of-sign-input{font:italic 48px/78px Georgia,serif;border-bottom:1px solid #333;padding:0 16px;margin:8px 0 16px}.of-sign-modal > p{font-size:12px}.of-sign-footer{display:flex;align-items:center;gap:28px;border-top:1px solid #eee;margin:20px -24px -24px;padding:16px 24px}.of-sign-footer small{font-size:10px;color:var(--ds-ink-50)}
.of-approval-layout { display:flex;padding:32px;gap:32px; }.of-approval-quote{flex:1}.of-approval-quote h3{margin-bottom:24px}.of-approval-panel{width:400px;border:1px solid #ddd;border-radius:10px;padding:24px}.of-approval-panel > p{margin-top:12px}.of-comment{margin:24px 0;padding:16px;background:var(--ds-surface-tint);border-radius:8px}.of-comment small{display:block;color:var(--ds-ink-50)}.of-comment p{margin-top:10px;font-size:13px}
.of-fields { display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:28px; }.of-fields label{font-size:12px;color:var(--ds-ink-50)}.of-fields label > span{display:block;font-size:14px;color:var(--ds-ink);padding:10px 12px;border:1px solid #ddd;border-radius:5px;margin-top:8px}.of-connected{display:flex;gap:10px;align-items:center;margin-top:20px!important}.of-connected img{width:30px;height:25px}.of-step-badge{display:inline-grid;place-items:center;border:1px solid #ddd;border-radius:50%;width:26px;height:26px;margin-right:10px}
.of-workspace-top { display:flex;align-items:center;justify-content:space-between;height:44px;padding:8px 16px;background:#1e2128;color:var(--ds-white); }.of-workspace-top > span{display:flex;gap:12px}.of-workspace-top .of-pill{background:#34373f;color:var(--ds-ink-50)}
.of-workspace-layout { display:flex;min-height:620px; }.of-workspace-layout > aside{width:180px;flex:none;padding:24px 16px;background:#1e2128;color:var(--ds-ink-50);font-size:12px}.of-workspace-layout aside small{display:block;color:var(--ds-ink-50);margin-bottom:12px;font-size:10px}.of-workspace-layout aside b{display:block;color:var(--ds-white);margin-bottom:28px}.of-workspace-layout aside > span{display:block;padding:10px 8px}.of-workspace-layout aside .is-selected{color:var(--ds-white);background:#34373f;border-radius:4px}.of-workspace-body{flex:1;padding:40px 32px;background:#fffdf9}.of-pricing-cards{display:flex;gap:12px;margin-top:35px}.of-plan{flex:1;position:relative;border:1px solid #e7e1d8;border-radius:8px;padding:18px;background:var(--ds-white);min-height:320px}.of-plan--recommended{border-color:#5a39ff}.of-plan small{font-size:10px;color:#5a39ff}.of-plan h3{margin:14px 0}.of-plan strong{font-size:32px;line-height:40px;font-weight:500}.of-plan p{font-size:11px;line-height:18px;margin:10px 0;color:var(--ds-ink-50)}.of-plan hr{border:0;border-top:1px solid #eee;margin:22px 0}.of-workspace-quote{padding:24px;border:1px solid #e7e1d8;background:var(--ds-white);border-radius:8px;margin-top:30px}
.of-sync { display:flex;align-items:center;width:940px;margin:50px 30px;gap:0; }.of-sync-document{width:340px;padding:32px;background:var(--ds-white);border:1px solid #e3e3e3;border-radius:10px;box-shadow:0 7px 9px #0000000a;flex:none}.of-sync-document > .of-icon{width:38px;height:38px;margin-bottom:24px}.of-sync-document h3{margin-bottom:10px}.of-sync-document > p{color:var(--ds-ink-50)}.of-sync-document strong{display:block;font-size:32px;line-height:40px;margin:25px 0 15px;font-weight:500}.of-sync-document .of-signature-row{border-top:1px solid #eee;padding-top:24px;flex-wrap:wrap;gap:8px}.of-sync-document em{font-size:24px;line-height:30px}.of-sync-lines{display:flex;align-items:center;flex:1;min-width:140px}.of-sync-lines i{flex:1;border-top:1px solid #b8d6f4}.of-sync-lines span{padding:7px 10px;background:var(--ds-white);border:1px solid #d9e9f9;border-radius:20px;font-size:11px;color:#528267;white-space:nowrap}.of-crm-stack{width:420px;display:flex;flex-direction:column;gap:24px}.of-crm-card{background:var(--ds-white);border:1px solid #e1e1e1;border-radius:10px;padding:22px}.of-crm-card h3{display:flex;align-items:center;gap:12px;margin-bottom:16px}.of-crm-card h3 img{width:38px;height:28px;object-fit:contain}.of-crm-card td{font-size:12px;padding:8px}.of-crm-card th{font-size:10px;padding:8px}
.of-activity-layout { padding:32px 60px; }.of-activity-metrics{display:flex;gap:16px;margin-bottom:32px}.of-activity-metrics > span{flex:1;padding:20px;border:1px solid #eee;border-radius:8px;color:var(--ds-ink-50);font-size:12px}.of-activity-metrics strong{display:block;color:var(--ds-ink);font-size:25px;font-weight:500;margin-top:10px}.of-activity-row{display:flex;align-items:center;gap:16px;padding:22px 0;border-bottom:1px solid #eee}.of-activity-row p{font-size:12px;color:var(--ds-ink-50);margin-top:4px}.of-activity-row > small{margin-left:auto;color:var(--ds-ink-50)}.of-activity-row .of-avatar{width:34px;height:34px}
.of-notifications { width:700px;margin:80px auto;display:flex;flex-direction:column;gap:28px; }.of-notification{display:flex;gap:18px;background:var(--ds-white);padding:28px;border:1px solid #e5e5e5;border-radius:12px;box-shadow:0 7px 9px #0000000a}.of-notification > img{width:36px;height:36px}.of-notification > div{flex:1}.of-notification small{color:var(--ds-ink-50);font-weight:400;margin-left:8px}.of-notification p{margin-top:10px;font-size:14px}.of-notification-deal{display:flex;align-items:center;gap:16px;border:1px solid #e5e5e5;border-radius:8px;margin:20px 0;padding:16px}.of-notification-deal .of-pill{margin-left:auto}.of-notification-deal p{font-size:12px;margin-top:4px;color:var(--ds-ink-50)}
.of-filter-popover { position:absolute;right:160px;top:235px;width:290px;padding:20px;border:1px solid #ddd;border-radius:10px;background:var(--ds-white);box-shadow:0 7px 9px #0000000a; }.of-filter-popover h3{font-size:16px}.of-filter-popover > small{display:block;margin:20px 0 10px;color:var(--ds-ink-50)}.of-filter-popover p{display:flex;align-items:center;gap:12px;padding:10px 0;font-size:13px}
.of-mail-preview { width:560px;margin:12px auto;background:var(--ds-white);border:1px solid #ddd;border-radius:10px;overflow:hidden; }.of-mail-preview-top{display:flex;align-items:center;gap:12px;background:#f5f7fb;padding:18px;color:var(--ds-ink-50)}.of-mail-preview-body{padding:32px}.of-mail-preview-body > img{width:86px;height:20px;margin-bottom:28px}.of-mail-preview-body h3{margin-bottom:24px}.of-mail-preview-body p{margin:16px 0;font-size:16px;line-height:24px}.of-mail-preview-body hr{border:0;border-top:1px solid #eee;margin:25px 0}
.of-signers { width:560px;margin:25px auto;border:1px solid #ddd;background:var(--ds-white);border-radius:10px;padding:28px; }.of-signers > p{margin-top:10px}.of-signer{display:flex;gap:12px;align-items:center;border:1px solid #e5e5e5;border-radius:8px;margin-top:20px;padding:18px 12px}.of-signer > span{color:var(--ds-ink-50)}.of-signer i{font-style:normal;color:var(--ds-ink-50);font-size:12px}.of-signer p{font-size:12px;color:var(--ds-ink-50);margin-top:5px}.of-signer .of-pill{margin-left:auto}
.of-art--small .of-sync { width:900px;transform:scale(.63);transform-origin:top left;margin:0 8px; }.of-art--small .of-sync-document{width:320px}

.of-ramp { margin-top:16px;padding:48px;display:grid;grid-template-columns:1fr 1.7fr;gap:48px; }
.of-ramp-preview { border:1px solid #e3e3e3;border-radius:10px;background:white;padding:24px; }
.of-ramp-title { display:flex;align-items:center;justify-content:space-between;font-size:16px;font-weight:500; }.of-ramp-title > span{font-size:12px;font-weight:400;color:var(--ds-ink-50)}
.of-ramp-years { display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:24px 0; }.of-ramp-years span{font-size:13px;color:var(--ds-ink-50)}.of-ramp-years strong{display:block;font:500 28px/36px var(--ds-font);margin:8px 0}.of-ramp-years small{font-size:11px;color:var(--ds-ink-50)}.of-ramp-years i{display:block;height:5px;width:var(--bar);background:var(--ds-blue);border-radius:4px;margin-top:20px}.of-ramp-years > div:nth-child(2) i{background:var(--ds-sky)}
.of-ramp-total{display:flex;justify-content:space-between;border-top:1px solid #eee;padding-top:16px;font-size:14px}.of-ramp-total b{font-weight:500}
@media(max-width:1100px){.of-ramp{grid-template-columns:1fr;padding:32px;gap:28px}}
@media(max-width:500px){.of-ramp-preview{padding:16px}.of-ramp-years{gap:10px}.of-ramp-years strong{font-size:21px;line-height:28px}.of-ramp-title{font-size:14px}.of-ramp-title > span{font-size:10px}}
/* Product density: native rows, quiet borders, restrained state colors. */
.of-scene{--of-line:rgba(18,23,34,.09)}
.of-ui-top{height:48px;border-color:var(--of-line);padding:8px 20px;font-size:13px}
.of-ui-btn{min-height:30px;padding:5px 10px;font-size:12px;line-height:18px;border-color:var(--of-line);border-radius:5px}
.of-ui-btn.of-primary{box-shadow:var(--ds-shadow-btn),var(--ds-shadow-btn-primary-inset)}
.of-pill{padding:2px 8px;border-radius:4px;font-size:11px;line-height:16px;font-weight:400}
.of-search{height:34px;min-width:220px;border-color:var(--of-line);background:var(--ds-white);font-size:12px}
.of-table{font-size:13px;line-height:20px}
.of-table th{padding:12px;font-size:12px;color:var(--ds-ink-80);border-color:var(--of-line);letter-spacing:.1px}
.of-table td{padding:12px;border-color:var(--of-line)}
.of-table td+td,.of-table th+th{border-left:.5px solid var(--of-line)}
.of-table tbody tr{background:var(--ds-surface-tint)}
.of-table .of-pill{min-width:70px;justify-content:center}
.of-product-name>b{width:20px;height:20px;font-size:8px;border-radius:4px}
.of-app{height:100%;min-height:0}
.of-sidebar{width:176px;padding:18px 10px;background:var(--ds-white);border-color:var(--of-line);display:flex;flex-direction:column}
.of-sidebar>img{width:68px;margin:0 10px 26px}
.of-sidebar>span{padding:8px 10px;font-size:12px;gap:9px}
.of-sidebar .is-selected{background:var(--ds-surface-tint);border-radius:4px;color:var(--ds-ink)}
.of-sidebar p{font-size:10px;color:var(--ds-ink-50);margin:14px 10px 8px}
.of-sidebar small{margin:auto 10px 8px;padding-top:20px;font-size:10px}
.of-settings-tabs{height:40px;padding:0 16px;background:var(--ds-surface-tint);border-color:var(--of-line)}
.of-settings-tabs>span{height:40px;border-color:var(--of-line);padding:0 15px}
.of-settings-tabs .of-ui-actions{gap:8px}
.of-pad{padding:24px 28px}
.of-filter-row{margin:12px 0 16px}
.of-settings-body{max-width:780px;margin:32px auto;padding:0 28px}
.of-rule{padding:20px;border-color:var(--of-line);border-radius:6px;background:var(--ds-white)}
.of-rule-fields{gap:8px}
.of-quote-layout{height:calc(100% - 48px);min-height:0;background:var(--ds-surface-tint)}
.of-quote-sheet{margin:20px;padding:24px;border-color:var(--of-line);border-radius:7px}
.of-option-tabs{font-size:13px;min-height:38px;border-color:var(--of-line);gap:10px}
.of-option-tabs span{padding:4px 12px 12px}
.of-quote-sheet>.of-filter-row{margin:20px 0}
.of-quote-sheet>.of-filter-row b{font-weight:400;color:var(--ds-ink-50)}
.of-quote-table td{padding:8px 5px;background:var(--ds-surface-tint)}
.of-quote-table th{color:var(--ds-ink-50);font-size:11px;padding:9px 6px}
.of-quote-table th:first-child{width:34%}
.of-quote-table th:nth-child(2){width:12%}
.of-quote-table th:nth-child(3){width:18%}
.of-quote-table th:nth-child(4){width:18%}
.of-quote-table .of-cell-edit{font-size:12px;padding:6px 8px;border-color:var(--of-line);min-height:32px}
.of-quote-table small{display:block;font-size:11px;line-height:17px;color:var(--ds-ink-50);padding:7px 8px 1px}
.of-quote-table .of-pill{min-width:0;margin-top:5px}
.of-add-line{font-size:12px;border-color:var(--of-line);padding:12px 8px}
.of-totals{width:260px;margin-top:20px;border-color:var(--of-line);background:var(--ds-surface-tint)}
.of-totals p{font-size:12px;padding:10px 14px}
.of-totals .of-total{border-color:var(--of-line);background:var(--ds-white);padding:14px}
.of-quote-terms{padding-top:12px;border-top:.5px solid var(--of-line);gap:24px}
.of-quote-sheet>h4{margin:18px 0 0;font-size:13px}
.has-ai .of-quote-sheet{margin:20px;padding:24px}
.has-ai .of-quote-table th{font-size:11px;padding:9px 5px}
.has-ai .of-cell-edit{font-size:12px;padding:6px}
.has-ai .of-quote-table small{font-size:11px}
.has-ai .of-pill{font-size:10px}
.of-ai-panel{width:320px;height:100%;border-color:var(--of-line);display:flex;flex-direction:column}
.of-ai-head{font-size:13px;height:48px;flex:none;border-color:var(--of-line)}
.of-ai-content{padding:20px;font-size:13px;line-height:21px}
.of-ai-content .of-user-msg{border-radius:8px;padding:12px 14px;margin-left:22px;background:var(--ds-surface-tint)}
.of-ai-changes{padding:16px;border-radius:6px;border-color:var(--of-line)}
.of-ai-changes>small{color:var(--ds-ink-50)}
.of-ai-composer{position:relative;bottom:auto;left:auto;right:auto;margin:auto 14px 16px;border-color:var(--of-line);border-radius:12px;box-shadow:var(--ds-shadow-btn)}
.of-ai-composer b{border-radius:6px;width:24px;height:24px;font-size:16px}
.of-product-modal{left:50%;top:112px;transform:translateX(-50%);width:480px;border:.5px solid var(--of-line);border-radius:10px;padding:24px;box-shadow:0 7px 9px #0000000a}
.of-library-product{padding:12px;border-radius:6px;border-color:var(--of-line)}
.of-overlay{inset:0;background:#12172226}
.of-overlay--light{background:#12172212}
.of-window:has(.of-form-paper) .of-screen{background:var(--ds-surface-tint)}
.of-form-paper{max-width:860px;margin:28px auto;padding:32px 40px;border:.5px solid #ebe5d8;border-radius:6px;background:var(--ds-white);box-shadow:0 2px 5px #12172204;width:calc(100% - 80px)}
.of-form-paper h2{font-size:28px;line-height:36px;font-weight:500;letter-spacing:-.5px}
.of-form-brand{margin-bottom:18px}
.of-form-brand>span{display:grid;place-items:center;width:38px;height:38px;border:2px solid var(--ds-white);border-radius:50%;background:#5a39ff;z-index:1}
.of-form-brand>span+span{background:var(--ds-ink);margin-left:-7px;z-index:0}
.of-form-brand>span>img{width:22px;height:22px;object-fit:contain;border-radius:0;margin:0}
.of-form-parties{margin:20px 0 28px;gap:28px;font-size:12px}
.of-form-parties small{color:var(--ds-ink-50);font-size:10px}
.of-form-paper .of-table tbody tr{background:var(--ds-white)}
.of-form-paper .of-table th{background:var(--ds-surface-tint);font-size:11px;color:var(--ds-ink-50)}
.of-form-paper .of-table td{font-size:12px;padding:13px 12px}
.of-signature-row{border-top:.5px solid var(--of-line);padding-top:20px;margin-top:24px}
.of-signature-row small{color:var(--ds-ink-50)}
.of-sign-modal{left:50%;top:240px;transform:translateX(-50%);border:.5px solid var(--of-line);border-radius:8px}
.of-sign-tabs{justify-content:flex-start;gap:28px;border-color:var(--of-line)}
.of-sign-input{color:var(--ds-ink);background:var(--ds-surface-tint);border-radius:4px;border:0;text-align:center;margin:20px 0;font-size:44px;line-height:84px}
.of-sign-footer{border-color:var(--of-line)}
.of-approval-layout{padding:32px;gap:32px}
.of-approval-panel{width:380px;border-color:var(--of-line);border-radius:6px;padding:24px}
.of-comment{background:var(--ds-surface-tint);border-radius:5px;margin:20px 0}
.of-workspace-layout{min-height:668px}
.of-workspace-layout>aside{width:172px;background:var(--ds-surface-tint);color:var(--ds-ink-80);border-right:.5px solid #ebe5d8}
.of-workspace-layout aside b{color:var(--ds-ink)}
.of-workspace-layout aside .is-selected{color:#5a39ff;background:var(--ds-white);border-radius:4px}
.of-workspace-body{background:#faf9f7;padding:36px 40px}
.of-workspace-body>.of-form-paper{width:100%;margin:24px 0}
.of-plan{border-radius:6px;border-color:#ebe5d8;padding:24px}
.of-plan--recommended{border-color:#5a39ff}
.of-plan strong{font-size:30px}
.of-activity-layout{padding:32px 40px}
.of-activity-metrics>span{border-radius:6px;border-color:var(--of-line)}
.of-activity-row{padding:20px 0;border-color:var(--of-line)}
.of-sync{margin:54px auto;width:calc(100% - 80px);max-width:1080px}
.of-crm-stack{width:440px;flex:none}.of-crm-card,.of-sync-document{border-radius:7px;border-color:var(--of-line)}
.of-notifications{width:780px;margin:72px auto;gap:24px}
.of-notification,.of-notification-deal{border-radius:7px;border-color:var(--of-line)}
.of-filter-popover{right:40px;top:188px;border-radius:7px;border-color:var(--of-line)}
/* Small cards deliberately crop the lower continuation, as on Home. */
.of-art--small .of-scene{top:16px;left:24px}
.of-mail-preview,.of-signers{border-radius:8px;border-color:var(--of-line)}
.of-signers{margin-top:12px;padding:24px}
.of-mail-preview{margin-top:12px}
.of-mail-preview-top{background:var(--ds-surface-tint);padding:14px 20px}
.of-mail-preview-body{padding:28px}
.of-art--hero .of-form-paper{width:calc(100% - 48px);padding:28px}
.of-art--hero .of-quote-sheet{margin:16px;padding:20px}
.of-art--hero .of-ui-top{font-size:11px;gap:8px;padding:8px 14px}
.of-art--hero .of-ui-btn{font-size:11px;padding-inline:8px}
.of-art--hero .of-sign-modal{top:250px}
@media(min-width:801px) and (max-width:1400px){.order-forms-page .sp-hero-left{padding-bottom:120px}.order-forms-page .sp-hero-left .logo-bar{flex-wrap:wrap;gap:12px}.order-forms-page .sp-hero-left .logo-bar-text{flex-basis:100%}}
@media(max-width:1100px){.of-card-copy,.of-capability{padding:32px}.of-signature-cards{grid-template-columns:1fr}.of-feature-card{display:grid;grid-template-columns:1fr 1fr}.of-art--small{height:320px}.of-standalone,.of-integration{grid-template-columns:1fr 1.3fr}.of-integration-copy{padding:32px}}
@media(max-width:800px){
 .order-forms-page .sp-hero-left{width:100%;padding:32px 28px}
 .order-forms-page .sp-hero-ctas{flex-wrap:wrap;gap:8px}
 .order-forms-page .sp-hero-ctas .btn{padding:10px 16px}
 .of-section-head{padding:0 24px;margin-bottom:28px}
 .of-hero-tabs{gap:18px}.of-hero-tabs button{font-size:14px}
 .of-tabs.tabs-section{height:auto}
 .of-tabs .ts-fit{position:relative;width:100%;height:auto;transform:none}
 .of-tabs .ts-rail{position:relative;inset:auto;width:auto;height:auto;padding:28px;gap:0}
 .of-tabs .sl-tab{padding-right:24px}.of-tabs .sl-tab.is-active{flex:none}
 .of-tabs .ts-rail .sl-tab+.sl-tab{margin-top:22px}
 .of-tabs .sl-tab>button{font-size:20px;line-height:28px}
 .of-tabs .ts-rail .sl-tab::after{right:0;top:9px}.of-tabs .ts-rail .sl-tab.is-active::after{right:-1px;top:8px}
 .of-tabs .ts-rail .sl-tab .ts-desc{width:100%;font-size:16px;line-height:25px;margin-top:12px}
 .of-tabs .ts-stage{position:relative;inset:auto;width:auto;height:420px;margin:0 12px 12px}
 .of-tabs .of-art{--of-width:900px;--of-height:736px}
 .of-tabs .of-scene{left:12px;top:12px}
 .of-art--hero{height:var(--of-mobile-height,440px);min-height:0}
 .of-art--hero .of-scene{top:24px;left:16px}
 .of-ai-feature,.of-signature-feature{height:440px}
 .of-ai-feature .of-art{--of-width:1100px}.of-signature-feature .of-art{--of-width:1000px}
 .of-ai-clients{padding:24px;gap:20px}.of-ai-clients>a{margin-left:0}
 .of-pricing-grid{grid-template-columns:1fr}.of-standalone,.of-integration{display:block}
 .of-standalone>div:first-child,.of-integration-copy{padding:32px}
 .of-standalone>.of-art{height:320px}.of-integration .of-art{min-height:360px}
 .of-feature-card{display:flex}.of-art--small{height:300px}
 .of-final-cta{padding:0 24px;flex-wrap:wrap}
 .of-ramp>div{min-width:0}
}
@media(max-width:760px){.order-forms-page .ds-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 20px}.order-forms-page .ds-footer-col a,.order-forms-page .ds-footer-heading{white-space:normal;overflow-wrap:anywhere}.order-forms-page .ds-footer-badges{grid-column:1/-1;flex-wrap:wrap}}
@media(max-width:380px){.of-ramp-years{grid-template-columns:1fr}.of-ramp-title{flex-wrap:wrap;gap:8px}.of-ramp-total{gap:12px}.of-ramp{padding:24px}}
.of-sidebar-brand{display:flex;align-items:center;justify-content:space-between;padding:0 10px 16px}
.of-sidebar-brand .of-wordmark{width:66px;height:22px}.of-sidebar-brand .of-avatar{width:22px;height:22px}
.of-sidebar>p{border-top:.5px solid var(--of-line);margin:14px -10px 6px;padding:14px 20px 0}
.of-sidebar>span{font-size:11px;padding-block:7px}
.of-app-main>.of-ui-top>span:first-child{font-size:18px;font-weight:500}
.of-modified{white-space:nowrap;color:var(--ds-ink-50);font-size:12px}
.of-product-modal{top:76px}
.of-product-modal h3{font-size:17px;line-height:24px;margin-bottom:16px}
.of-product-modal>.of-search{margin-bottom:14px;justify-content:flex-start}
.of-product-modal>.of-search .of-icon{margin-left:0}
.of-library-product{margin-top:8px;padding:10px 12px}
.of-library-product p{line-height:16px;margin:3px 0}
.of-library-product small{font-size:11px;line-height:16px}
/* Keep the quote's total visible; only the terms continue below the viewport. */
.of-quote-sheet>.of-filter-row{margin:16px 0}
.of-quote-table td{padding:6px 5px}
.of-quote-table .of-cell-edit,.has-ai .of-quote-table .of-cell-edit{line-height:18px;min-height:30px;padding:5px 7px}
.of-quote-table td small{margin:0;padding:3px 7px 0;line-height:16px}
.of-add-line{padding:9px 8px}
.of-totals p{padding:8px 14px}.of-totals .of-total{padding:12px 14px}
/* The supplied wordmark has preserveAspectRatio=none; this local copy restores
   its original ratio, and never participates in flex shrinking. */
.of-scene img[src$="dock-wordmark.svg"]{width:76px;height:auto;aspect-ratio:85.8437 / 17.9985;object-fit:contain;flex:none}
.of-sidebar-brand img.of-wordmark{width:72px;height:auto}
/* Finish: quiet surfaces and one control rhythm, while keeping Dock's content. */
.of-table{font-variant-numeric:tabular-nums}
.of-table tbody tr{background:var(--ds-white)}
.of-table th{background:var(--ds-surface-tint);font-size:11px;color:var(--ds-ink-50)}
.of-table td+td{border-left:0}
.of-table th+th{border-left:.5px solid var(--of-line)}
.of-table td{height:48px}
.of-quote-table td{height:auto;background:var(--ds-surface-tint)}
.of-quote-table th{background:var(--ds-white)}
.of-pill{border-radius:4px}
.of-settings-body .of-table td{height:auto}
.of-table .of-green{background:#edf6f0;color:#397356}
.of-search{box-shadow:0 1px 2px #12172204}
.of-ui-btn{font-weight:400;box-shadow:var(--ds-shadow-btn);border-radius:5px}
.of-ui-btn.of-primary{box-shadow:var(--ds-shadow-btn),var(--ds-shadow-btn-primary-inset)}
#quote-builder-panel-2 .of-quote-table tr:nth-child(2) td:nth-child(2) .of-cell-edit{border-color:var(--ds-blue);box-shadow:0 0 0 2px #0068f914}
.of-sync-document{width:320px}.of-crm-stack{width:380px}.of-sync-lines{min-width:100px}
/* Product library: one line per record, with compact pricing summaries. */
.of-products-table{table-layout:fixed}
.of-products-table th:nth-child(1){width:26%;padding-left:60px}
.of-products-table th:nth-child(2){width:9%}
.of-products-table th:nth-child(3){width:12%}
.of-products-table th:nth-child(4){width:29%}
.of-products-table th:nth-child(5){width:14%}
.of-products-table th:nth-child(6){width:10%}
.of-products-table th,.of-products-table td{white-space:nowrap;vertical-align:middle;padding:0 12px;height:48px;line-height:20px}
.of-products-table th{height:40px}
.of-products-table tbody tr:nth-child(n){background:var(--ds-white)}
.of-products-table .of-pill{min-width:0;padding:2px 6px}
.of-products-table .of-product-name{gap:8px}
.of-product-price{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px}
.of-product-price>span:first-child{display:flex;align-items:baseline;gap:4px;min-width:0}
.of-product-price b{font-weight:400}
.of-price-unit{font-size:11px;color:var(--ds-ink-50)}
.of-price-detail{flex:none;font-size:10px;line-height:18px;padding:1px 5px;border:.5px solid var(--of-line);border-radius:4px;color:var(--ds-ink-50)}
/* Illustration controls need a quieter treatment than the marketing CTAs. */
.of-scene .of-ui-btn{box-shadow:0 1px 2px #12172206;border-color:#12172214}
.of-scene .of-ui-btn.of-primary{border-color:transparent;box-shadow:0 1px 2px #12172208,inset 0 1px 0 #ffffff24}
.of-ui-btn .of-icon{width:12px;height:12px;flex:0 0 12px}
/* Salesforce record reuses the integration page's native navigation and header. */
.of-sf-app{height:100%;min-height:0;font-family:var(--ds-font-ui);background:var(--ds-surface-gray)}
.of-sf-app .cr-sf-global{height:48px;gap:20px;font-size:11px;border-bottom-width:2px}
.of-sf-app .cr-sf-global>img:first-child{width:40px;height:28px;object-fit:contain;flex:none}
.of-sf-app .cr-sf-global>b{font-size:17px}
.of-sf-app .cr-sf-record{padding:18px}
.of-sf-app .cr-sf-record-head{padding:16px}
.of-sf-app .cr-sf-record-head h3{font:500 20px/28px var(--ds-font)}
.of-sf-app .cr-sf-highlights{padding:0 16px 16px}
.of-sf-app .cr-field{display:flex;flex-direction:column;gap:4px;font-family:var(--ds-font-ui)}
.of-sf-body{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:16px;margin-top:16px}
.of-sf-related,.of-sf-aside{background:var(--ds-white);border:1px solid var(--of-line);border-radius:5px}
.of-sf-related{padding:0 16px 16px;min-width:0}
.of-sf-related .cr-native-tabs{height:42px;font-size:12px}
.of-sf-section-title{display:flex;align-items:center;gap:8px;padding:18px 0 12px;font-size:12px}
.of-sf-section-title>span{margin-left:auto;color:var(--ds-ink-50);font-size:10px}
.of-sf-products{table-layout:fixed;font-size:12px}
.of-sf-products th:first-child{width:40%}
.of-sf-products th,.of-sf-products td{height:38px;padding:8px;white-space:nowrap;font-size:11px}
.of-sf-products th:not(:first-child),.of-sf-products td:not(:first-child){text-align:right}
.of-sf-products td:first-child{color:var(--ds-blue)}
.of-sf-amount{display:flex;justify-content:flex-end;gap:24px;padding:14px 8px;border-bottom:1px solid var(--of-line);font-size:11px}
.of-sf-amount span{display:flex;gap:12px;color:var(--ds-ink-50)}
.of-sf-amount b,.of-sf-amount strong{font-weight:500;color:var(--ds-ink)}
.of-sf-file{display:flex;align-items:center;gap:10px;border:1px solid var(--of-line);border-radius:4px;padding:12px}
.of-sf-pdf{display:grid;place-items:center;width:30px;height:36px;background:var(--ds-surface-tint);font-size:9px;color:var(--ds-ink-50)}
.of-sf-file>div{flex:1;min-width:0;font-size:11px;color:var(--ds-blue)}
.of-sf-file small{display:block;font-size:10px;color:var(--ds-ink-50);margin-top:3px}
.of-sf-aside{align-self:start;padding:20px}
.of-sf-sync-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}
.of-sf-aside h3{font-size:16px;line-height:24px}
.of-sf-aside p{font-size:12px;line-height:19px;color:var(--ds-ink-50);margin-top:8px}
.of-sf-contract{display:grid;gap:16px;padding:22px 0}
.of-sf-contract>span{display:flex;flex-direction:column;gap:4px;font-size:11px;color:var(--ds-ink-50)}
.of-sf-contract b{font-size:12px;color:var(--ds-ink)}
.of-sf-sync-foot{display:flex;align-items:center;gap:6px;padding-top:16px;border-top:1px solid var(--of-line);font-size:10px;color:var(--ds-ink-50)}
@media(max-width:800px){.of-sf-body{grid-template-columns:minmax(0,1fr) 220px;gap:12px}.of-sf-app .cr-app-search{min-width:160px}.of-sf-aside{padding:16px}}
/* Buyer workspace: restrained branded shell, clear document hierarchy. */
.of-workspace-top{height:52px;padding:0 22px;background:var(--ds-white);color:var(--ds-ink);border-bottom:1px solid var(--of-line)}
.of-buyer-brand,.of-buyer-toolbar{display:flex;align-items:center;gap:12px;font-size:12px}
.of-buyer-brand>img{width:24px;height:24px;object-fit:contain;flex:none}
.of-buyer-brand i{font-style:normal;color:var(--ds-ink-50);margin:0 8px}
.of-buyer-avatar{width:25px;height:25px;border-radius:50%;object-fit:cover}
.of-workspace-layout{height:calc(100% - 52px);min-height:0}
.of-workspace-layout>aside{width:196px;padding:24px 12px 18px;display:flex;flex-direction:column;background:var(--ds-white);border-color:var(--of-line)}
.of-buyer-room{padding:0 10px 24px}
.of-buyer-room>img{width:32px;height:32px;object-fit:contain;margin-bottom:12px}
.of-workspace-layout .of-buyer-room b{font-size:12px;margin:0 0 4px}
.of-workspace-layout .of-buyer-room small{font-size:10px;margin:0}
.of-workspace-layout aside>small{font-size:9px;letter-spacing:.04em;padding:0 10px;margin-bottom:10px}
.of-workspace-layout aside>span{display:flex;align-items:center;gap:9px;padding:10px;font-size:11px}
.of-workspace-layout aside>span .of-icon{width:13px;height:13px;opacity:.55}
.of-workspace-layout aside .is-selected{background:var(--ds-surface-tint);color:var(--ds-ink);font-weight:500}
.of-workspace-layout aside .is-selected .of-icon{opacity:1}
.of-buyer-owner{display:flex;align-items:center;gap:8px;margin-top:auto;padding:20px 8px 14px}
.of-buyer-owner>img{width:27px;height:27px;border-radius:50%;object-fit:cover}
.of-workspace-layout .of-buyer-owner b{font-size:10px;margin:0 0 2px}
.of-workspace-layout .of-buyer-owner small{font-size:9px;margin:0;white-space:nowrap}
.of-buyer-powered{display:flex;align-items:center;gap:6px;padding:12px 8px 0;border-top:1px solid var(--of-line);font-size:9px;color:var(--ds-ink-50)}
.of-scene .of-buyer-powered img[src$="dock-wordmark.svg"]{width:42px}
.of-workspace-body{padding:24px 34px;min-width:0;background:var(--ds-surface-tint)}
.of-buyer-heading>span{display:block;font-size:9px;letter-spacing:.08em;color:var(--ds-ink-50);margin-bottom:8px}
.of-buyer-heading h2{font-size:25px;line-height:33px}
.of-buyer-heading p{font-size:12px;line-height:20px;color:var(--ds-ink-50);margin-top:7px}
.of-pricing-cards{margin-top:26px;gap:12px}
.of-plan{display:flex;flex-direction:column;min-width:0;min-height:322px;padding:22px;border-color:var(--of-line);border-radius:6px;box-shadow:0 2px 4px #12172203}
.of-plan--recommended{border-color:var(--ds-blue);box-shadow:inset 0 3px 0 var(--ds-blue)}
.of-plan small{font-size:9px;line-height:16px;color:var(--ds-ink-50)}
.of-plan--recommended small{color:var(--ds-blue)}
.of-plan h3{font-size:16px;line-height:24px;margin:14px 0 12px}
.of-plan strong{font-size:32px;line-height:40px;letter-spacing:-1px}
.of-plan p{font-size:11px;color:var(--ds-ink-80);margin:6px 0}
.of-plan .of-plan-period{font-size:10px;color:var(--ds-ink-50);margin-top:4px;white-space:nowrap}
.of-plan hr{width:100%;border-color:var(--of-line);margin:18px 0 12px}
.of-plan .of-plan-cta{display:flex;justify-content:space-between;margin-top:22px;font-size:11px}
.of-plan--recommended .of-plan-cta{background:var(--ds-blue);color:var(--ds-white);border-color:transparent}
.of-buyer-note{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--ds-ink-50);margin-top:20px}
.of-buyer-note b{font-weight:400;color:var(--ds-ink)}
.of-workspace-quote{margin-top:16px;padding:16px 24px;border-color:var(--of-line);border-radius:6px;box-shadow:0 2px 4px #12172203}
.of-buyer-quote-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.of-buyer-quote-head small{font-size:9px;letter-spacing:.04em;color:var(--ds-ink-50)}
.of-buyer-quote-head h3{font-size:16px;line-height:24px;margin-top:4px}
.of-workspace-quote .of-table{table-layout:fixed;font-size:12px}
.of-workspace-quote .of-table th:first-child{width:58%}
.of-workspace-quote .of-table th:not(:first-child),.of-workspace-quote .of-table td:not(:first-child){text-align:right;white-space:nowrap}
.of-workspace-quote .of-table th{padding:10px 12px;font-size:10px}
.of-workspace-quote .of-table td{padding:10px 12px;height:42px}
.of-workspace-quote .of-table tr:last-child td{background:var(--ds-surface-tint)}
.of-buyer-terms{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:16px}
.of-buyer-terms span{font-size:10px;color:var(--ds-ink-50)}
.of-buyer-terms b{display:block;font-size:11px;color:var(--ds-ink);margin-top:5px}
.of-buyer-quote-foot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--of-line);margin-top:16px;padding-top:12px;font-size:10px;color:var(--ds-ink-50)}
.of-workspace-quote .of-signature-row{margin-top:22px;border-top:1px solid var(--of-line);padding-top:14px}
.of-workspace-quote .of-signature-row em{font-size:24px;line-height:30px}
.of-workspace-quote .of-signature-row p{font-size:10px}
@media(max-width:800px){.of-workspace-layout>aside{width:166px}.of-workspace-body{padding:24px}.of-plan{padding:16px}.of-buyer-note{font-size:10px}}