@font-face{font-family:StudioDocument;src:url('./fonts/document-studio/HankenGrotesk.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap}
.db-bench{--db-ink:#171815;--db-paper:#f2f0e8;--db-line:#d5d5cb;--db-muted:#686a60;--db-acid:#d9f27b;color:var(--db-ink);background:var(--db-paper);border:1px solid var(--db-ink);font-family:var(--font-sans,'Hanken Grotesk',sans-serif);text-align:left;max-width:100%;isolation:isolate}
.db-bench *{box-sizing:border-box}.db-bench [hidden]{display:none!important}.db-bench :is(button,input,textarea,select){font:inherit}.db-bench :is(button,summary){cursor:pointer}.db-bench :is(button,input,textarea,select,summary):focus-visible{outline:2px solid #8b4a31;outline-offset:4px}.db-bench button:disabled{cursor:default;opacity:.38}
.db-topline{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:68px;padding:17px 26px;background:var(--db-ink);color:var(--db-paper)}.db-brand{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:600;letter-spacing:-.03em}.db-brand-mark{display:grid;place-items:center;width:29px;height:29px;color:var(--db-ink);background:var(--db-acid);font-size:23px;line-height:1}.db-beta{margin-left:10px;font-size:11px;font-weight:400;letter-spacing:.12em;color:#aaa99f}.db-local{display:flex;align-items:center;gap:8px;font-size:11px;color:#c8c9bc}.db-local i,.db-preview-bar i{width:5px;height:5px;border-radius:50%;background:var(--db-acid)}
.db-workspace{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.25fr)}.db-authoring{padding:32px;min-width:0;border-right:1px solid var(--db-line)}.db-eyebrow{font-size:11px;letter-spacing:.12em;color:var(--db-muted)}.db-editor-heading h3{font:500 28px/1.1 var(--font-sans,'Hanken Grotesk',sans-serif);letter-spacing:-1.2px;margin:10px 0 29px}.db-bench fieldset{min-width:0;margin:0;padding:0;border:0}.db-bench legend,.db-field>span,.db-layout>span{font-size:11px;font-weight:500;color:#53564a;margin-bottom:10px;padding:0}
.db-starters>div{display:grid;grid-template-columns:1fr 1fr;gap:8px}.db-starters label{position:relative;cursor:pointer}.db-starters input,.db-accents input{position:absolute;opacity:0;width:100%;height:100%;margin:0;inset:0;cursor:pointer}.db-starters label>span{display:flex;align-items:center;gap:9px;min-height:48px;padding:12px;border:1px solid #c5c7bb;font-size:11px;transition:background .18s,border-color .18s}.db-starters b{font-size:18px;font-weight:400}.db-starters input:checked+span{border-color:var(--db-ink);background:#e0e4d5}.db-starters input:focus-visible+span,.db-accents input:focus-visible+span{outline:2px solid #8b4a31;outline-offset:4px}
.db-fields{margin-top:27px}.db-field{display:block;min-width:0;margin-bottom:19px}.db-field>span{display:block;margin-bottom:6px}.db-field input,.db-field textarea{display:block;width:100%;max-width:100%;min-width:0;padding:10px 11px;border:1px solid #c7c9bd;border-radius:0;background:#fffefb;color:var(--db-ink);font-size:13px;line-height:1.45;box-shadow:none}.db-field input{min-height:42px}.db-field textarea{resize:vertical;min-height:64px;max-height:250px}.db-field :is(input,textarea):hover{border-color:#888e79}
.db-section-label{display:flex;justify-content:space-between;font-size:11px;color:#53564a;margin-top:27px;margin-bottom:10px}.db-section-label>span:last-child{color:#777a6c;font-size:11px}.db-section-editor{border-top:1px solid #c7c9bd}.db-section-editor:last-child{border-bottom:1px solid #c7c9bd}.db-section-editor summary{display:flex;gap:12px;align-items:center;padding:15px 0;list-style:none;font-size:12px}.db-section-editor summary::-webkit-details-marker{display:none}.db-section-number{font-size:11px;color:#7d8071}.db-section-title{flex:1;overflow-wrap:anywhere}.db-section-toggle{font-size:16px;color:#60664f;transition:transform .2s}.db-section-editor[open] .db-section-toggle{transform:rotate(45deg)}.db-section-fields{padding:4px 0 18px 24px}.db-section-fields .db-field{margin-bottom:13px}.db-remove{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;border:0;padding:5px 0;background:none;color:#9a4936;font-size:11px!important;min-height:29px}.db-remove>span{font-size:18px}.db-add{display:flex;align-items:center;justify-content:center;gap:6px;min-height:40px;width:100%;padding:10px 13px;margin-top:12px;border:1px dashed #a9ae9c;background:transparent;font-size:11px!important;color:#454b39}.db-add:hover{background:#e4e7da}.db-add>span{font-size:17px}
.db-finish{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding-top:27px}.db-accents>div{display:flex;align-items:center;gap:10px}.db-accents label{display:block;position:relative;width:29px;height:29px;cursor:pointer}.db-accents span{display:block;width:29px;height:29px;background:var(--swatch);border-radius:50%;border:3px solid var(--db-paper);outline:1px solid transparent}.db-accents input:checked+span{outline-color:var(--db-ink)}.db-layout{display:block;min-width:0;width:125px}.db-layout>span{display:block;margin-bottom:7px}.db-layout select{width:100%;min-height:33px;border:0;border-bottom:1px solid #a9ae9c;border-radius:0;padding:4px 15px 4px 0;background:transparent;font-size:11px}
.db-preview{min-width:0;background:#dfe1d7;padding-bottom:19px}.db-preview-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 26px;border-bottom:1px solid #c7cbbd;font-size:11px;letter-spacing:.06em;color:#575d4a}.db-preview-bar>span:first-child{display:flex;align-items:center;gap:7px}.db-preview-bar i{background:#5c7337}.db-preview-bar>span:last-child{letter-spacing:0}.db-paper-stage{display:flex;justify-content:center;min-width:0;padding:30px 36px 20px;background-image:radial-gradient(#b4b9a8 .65px,transparent .65px);background-size:8px 8px}.db-paper{width:100%;max-width:460px;aspect-ratio:595.28/841.89;min-width:0;align-self:flex-start;background:#fffefb;box-shadow:0 1px 2px #252a2115,0 11px 25px -8px #252a213d}.db-paper svg{display:block;width:100%;height:auto;font-family:StudioDocument,sans-serif;font-weight:400;letter-spacing:0;line-height:1;font-feature-settings:normal}.db-paper text{font-weight:400;white-space:pre}.db-loading{display:flex;justify-content:center;align-items:center;height:100%;font-size:12px;color:#727969}
.db-pagination{display:flex;justify-content:center;align-items:center;gap:16px;font-size:11px;color:#59614e}.db-pagination button{display:grid;place-items:center;width:32px;height:32px;border:1px solid #b4bca7;background:transparent;color:var(--db-ink);font-size:17px}.db-pagination button:not(:disabled):hover{background:#f2f0e8}.db-export-bar{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:25px 27px 0;padding-top:21px;border-top:1px solid #b9c0ac}.db-export-label{font-size:11px;letter-spacing:.1em;color:#606851}.db-export-bar p{font-size:15px;letter-spacing:-.4px;margin:5px 0 0}.db-download{display:flex;align-items:center;justify-content:space-between;gap:18px;min-width:155px;min-height:45px;padding:12px 15px;background:var(--db-ink);color:var(--db-paper);border:1px solid var(--db-ink);font-size:11px!important;transition:background .2s,color .2s}.db-download:hover:not(:disabled){background:var(--db-acid);color:var(--db-ink)}.db-download>span:last-child{font-size:18px}.db-status{font-size:11px;line-height:1.5;min-height:15px;color:#4a5940;margin:15px 27px 0}.db-status.db-error{color:#9a3d2e}.db-scope{font-size:11px;line-height:1.6;color:#626a55;margin:7px 27px 0;max-width:390px}
@media(min-width:1200px){.db-authoring{padding:34px 38px}.db-editor-heading h3{font-size:32px}.db-paper-stage{padding:34px 48px 20px}}
@media(max-width:900px){.db-workspace{grid-template-columns:minmax(245px,.88fr) minmax(0,1fr)}.db-authoring{padding:25px}.db-paper-stage{padding:26px 23px 17px}.db-export-bar{align-items:flex-start;flex-direction:column;margin:22px 22px 0}.db-download{width:100%}.db-preview-bar{padding:18px 22px}.db-status,.db-scope{margin-left:22px;margin-right:22px}.db-starters label>span{padding:10px 8px;font-size:11px;gap:5px}.db-beta{display:none}}
@media(max-width:700px){.db-workspace{grid-template-columns:1fr}.db-authoring{border-right:0;border-bottom:1px solid #b9c0ac;padding:27px}.db-topline{padding:17px 22px}.db-brand{font-size:16px}.db-local{font-size:11px}.db-editor-heading h3{font-size:32px}.db-fields{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.db-fields .db-field:last-child{grid-column:1/-1}.db-field input,.db-field textarea{font-size:16px}.db-field>span,.db-bench legend,.db-layout>span{font-size:11px}.db-starters label>span{font-size:12px;gap:10px;padding:12px}.db-starters b{font-size:21px}.db-section-editor summary{font-size:14px}.db-finish{justify-content:flex-start;gap:35px}.db-paper-stage{padding:30px 38px 18px}.db-export-bar{flex-direction:row;align-items:center;margin:23px 27px 0}.db-download{width:auto;min-width:165px}.db-status,.db-scope{margin-left:27px;margin-right:27px}.db-preview-bar{padding:18px 27px}.db-preview{padding-bottom:23px}.db-scope{font-size:11px}.db-pagination{font-size:11px}.db-pagination button{width:37px;height:37px}.db-remove{font-size:12px!important;min-height:34px}.db-add{font-size:13px!important}}
@media(max-width:420px){.db-topline{flex-wrap:wrap;gap:10px}.db-local{margin-left:39px}.db-authoring{padding:24px 21px}.db-fields{grid-template-columns:1fr;gap:0}.db-editor-heading h3{font-size:29px}.db-paper-stage{padding:24px 16px 17px}.db-preview-bar{padding:17px 20px;font-size:11px}.db-export-bar{margin:21px 20px 0;gap:12px;align-items:stretch;flex-direction:column}.db-export-bar p{font-size:16px}.db-download{min-height:46px;font-size:13px!important}.db-status,.db-scope{margin-left:20px;margin-right:20px}.db-section-fields{padding-left:0}.db-finish{justify-content:space-between;gap:20px}}
@media(prefers-reduced-motion:reduce){.db-bench *{animation:none!important;transition:none!important}}

/* Controls and captions are UI text, independent of the document's print scale. */
.db-bench legend,.db-field>span,.db-layout>span,.db-section-label,.db-section-editor summary,.db-starters label>span{font-size:13px}
.db-field input,.db-field textarea{font-size:14px}
.db-status,.db-scope{font-size:12px;line-height:1.6}
.db-topline,.db-preview-bar{flex-wrap:wrap}
@media(max-width:700px){.db-field input,.db-field textarea{font-size:16px}}