.demo-intro{padding:54px 0 36px;display:flex;align-items:end;justify-content:space-between;gap:32px}.demo-intro h1{font-size:clamp(44px,5vw,72px);line-height:1.1;margin:22px 0 18px;color:#efed58}.demo-intro p:not(.eyebrow){max-width:660px;color:#FFFDD0;font-size:19px;line-height:1.6}.demo-back{font-size:16px;text-decoration:underline;white-space:nowrap;margin-bottom:24px}.demo-app{--ink:#242720;--paper:#f6f5ed;--muted:#585d52;color:var(--ink);background:var(--paper);border-radius:6px;overflow:hidden;color-scheme:light;margin-bottom:64px}.demo-bar{padding:24px 30px;background:#efed58;display:flex;justify-content:space-between;align-items:center;gap:20px}.demo-bar strong{font-size:20px}.demo-bar p{margin:4px 0 0;font-size:16px}.demo-app button,.demo-app select,.demo-app input{font:inherit;font-size:16px}.demo-app button{cursor:pointer;transition:background .2s,transform .2s}.demo-app button:hover{transform:translateY(-1px)}.demo-app button:focus-visible,.demo-app select:focus-visible,.demo-app input:focus-visible{outline:3px solid #626400;outline-offset:4px}.demo-reset,.demo-download{border:1px solid #242720;border-radius:4px;background:transparent;color:#242720;padding:11px 16px;font-weight:600}.demo-reset:hover{background:#fff8}.demo-metrics{display:grid;grid-template-columns:repeat(4,1fr);padding:26px 30px;border-bottom:1px solid #d2d4c7;gap:20px}.demo-metrics div{border-right:1px solid #d2d4c7;padding-right:12px}.demo-metrics div:last-child{border:0}.demo-metrics strong{font-size:34px;font-weight:500;display:block;line-height:1.1}.demo-metrics span{font-size:15px;color:#585d52;display:block;margin-top:8px}.demo-tabs{display:flex;gap:26px;padding:0 30px;border-bottom:1px solid #d2d4c7}.demo-tabs button{border:0;border-bottom:3px solid transparent;background:none;padding:20px 0 16px;color:#585d52;font-weight:650}.demo-tabs button[aria-selected=true]{border-bottom-color:#242720;color:#242720}.demo-panel{padding:30px}.demo-panel[hidden]{display:none}.demo-panel h2{font-size:32px;line-height:1.25;margin:0 0 8px}.demo-lead{color:#585d52;line-height:1.6;margin:0 0 24px;font-size:17px}.demo-filters{display:grid;grid-template-columns:minmax(180px,1fr) 200px;gap:20px;margin:24px 0}.demo-app label{display:block;font-size:15px;font-weight:600}.demo-app input[type=search],.demo-app select{width:100%;border:1px solid #b5b9ad;background:#fff;color:#242720;border-radius:3px;padding:10px 12px;margin-top:7px;min-height:44px}.demo-count{font-size:15px;color:#585d52;margin:12px 0}.demo-jobs{display:grid;gap:12px}.demo-job{display:grid;grid-template-columns:minmax(0,1fr) 180px 160px;gap:22px;align-items:center;background:#fff;border:1px solid #d2d4c7;border-radius:4px;padding:22px}.demo-job h3{font:600 20px var(--font);margin:6px 0;color:#242720}.demo-job p{margin:5px 0;font-size:16px;color:#585d52}.demo-job .job-ref{font-size:13px;font-weight:650;letter-spacing:.04em;color:#585d52}.priority{display:inline-block;margin-left:12px;font-size:12px;letter-spacing:.04em;background:#efed58;padding:3px 7px;color:#242720}.demo-team{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.person-card{border:1px solid #d2d4c7;background:#fff;border-radius:4px;padding:24px}.person-card h3{font:600 22px var(--font);margin:0 0 4px}.person-role{font-size:16px;color:#585d52;margin:0 0 20px}.person-card progress{accent-color:#777a13;width:100%;height:8px;display:block;margin:10px 0 24px}.person-card .check{display:flex;gap:12px;align-items:start;font-weight:400;line-height:1.5;margin:15px 0;font-size:16px}.check input{width:20px;height:20px;accent-color:#383b25;flex-shrink:0;margin:3px 0}.person-status{font-size:15px;color:#585d52}.demo-doc-layout{display:grid;grid-template-columns:minmax(220px,.7fr) minmax(0,1.3fr);gap:30px}.demo-download{background:#242720;color:#FFFDD0;margin-top:20px;width:100%}.demo-download:hover{background:#444a37}.demo-doc-note{font-size:15px;color:#585d52;line-height:1.5}.demo-document{background:#fff;border:1px solid #d2d4c7;padding:28px}.demo-document h3{font-size:28px;margin:0 0 20px}.demo-document pre{white-space:pre-wrap;overflow-wrap:anywhere;font:15px/1.7 var(--font);margin:0}.demo-feedback{min-height:28px;font-size:15px;margin:0;padding:14px 30px;border-top:1px solid #d2d4c7;background:#eaece0;color:#373d2e}.demo-empty{padding:30px;text-align:center;border:1px dashed #acb19f}.demo-how{display:flex;gap:40px;justify-content:space-between;margin-bottom:54px}.demo-how h2{font-size:34px;margin:0}.demo-how p{max-width:650px;font-size:18px;line-height:1.7;margin:0;color:#FFFDD0}@media(max-width:1000px){.demo-job{grid-template-columns:minmax(0,1fr) 160px 150px;gap:16px}.demo-team{grid-template-columns:1fr}.demo-doc-layout{grid-template-columns:1fr}.demo-intro{display:block}}@media(max-width:760px){.demo-intro{padding:38px 0 26px}.demo-intro p:not(.eyebrow){font-size:17px}.demo-back{display:inline-block;margin:10px 0}.demo-bar{padding:20px;align-items:start;flex-direction:column}.demo-metrics{grid-template-columns:repeat(2,1fr);padding:22px 20px;gap:24px}.demo-metrics div:nth-child(2){border:0}.demo-tabs{padding:0 20px;gap:24px}.demo-panel{padding:24px 20px}.demo-filters{grid-template-columns:1fr;gap:14px}.demo-job{grid-template-columns:1fr;padding:18px;gap:14px}.demo-feedback{padding:16px 20px}.demo-document{padding:20px}.demo-how{display:block}.demo-how h2{margin-bottom:18px}.demo-panel h2{font-size:30px}}@media(prefers-reduced-motion:reduce){.demo-app button{transition:none}.demo-app button:hover{transform:none}}
@media(max-width:400px){.demo-tabs{padding:0 12px;gap:0;justify-content:space-between}.demo-tabs button{font-size:15px}}