.demo-body{background:#f4f7fc;font-size:13px;line-height:1.5;min-height:100vh}.demo-banner{background:#e9f3ff;color:#376491;padding:12px 20px;display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:9px;font-weight:650;letter-spacing:.5px;border-bottom:1px solid #d8e7f7}.demo-reset{border:1px solid #bad2ee;border-radius:6px;padding:7px 11px;color:#315c8e;background:#fff;font-size:11px;white-space:nowrap}.demo-shell{display:grid;grid-template-columns:190px 1fr;min-height:730px}.demo-sidebar{padding:25px 18px;background:white;border-right:1px solid #e5ebf3;display:flex;flex-direction:column;gap:20px}.demo-brand{display:inline-flex;width:42px;height:42px;background:#0766f8;color:#fff;font-size:24px;font-weight:800;align-items:center;justify-content:center;border-radius:10px;letter-spacing:-2px}.demo-brand span{font-size:17px}.demo-sidebar>strong{font-size:13px;line-height:1.4}.demo-sidebar [role=tablist]{display:grid;gap:6px}.demo-sidebar [role=tab]{background:none;border:0;color:#6a7c90;font-size:12px;padding:11px 12px;border-radius:7px;text-align:left}.demo-sidebar [aria-selected=true]{background:#eaf2ff;color:#0060ec;font-weight:700}.sidebar-help{margin-top:auto;color:#9aa6b5;font-size:11px;line-height:1.8;border-top:1px solid #eef2f7;padding-top:20px}.demo-main{padding:30px;min-width:0}.demo-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 25px}.demo-heading h1{font-size:28px;margin:5px 0}.demo-heading p{font-size:12px;margin:0}.demo-heading .eyebrow{font-size:8px}.demo-avatar{display:flex;align-items:center;justify-content:center;background:#e8e0ff;color:#6e55b5;width:40px;height:40px;border-radius:50%;font-weight:700}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:25px}.stat{background:#fff;border:1px solid #e2e9f3;border-radius:9px;padding:17px 19px}.stat small{font-size:10px;color:#8695a8}.stat b{display:block;font-size:27px;letter-spacing:-1px;margin-top:6px}.stat span{font-size:10px;color:#399576;display:block;margin-top:3px}.demo-card{background:white;border:1px solid #e2e9f3;border-radius:10px;padding:23px;margin-bottom:20px;min-width:0}.demo-card h2{font-size:17px;margin-bottom:8px}.demo-card>p{font-size:12px;margin-bottom:20px}.demo-columns{display:grid;grid-template-columns:1.3fr 1fr;gap:20px;align-items:start}.demo-form{display:grid;gap:14px}.demo-form label{display:block;font-size:11px;font-weight:600;color:#63778e}.demo-form input,.demo-form select,.demo-form textarea,.demo-filter{width:100%;display:block;margin-top:6px;padding:10px 11px;border:1px solid #dce5f0;border-radius:6px;background:#fafcff;color:#243850;font-size:12px}.demo-form textarea{resize:vertical}.demo-form button,.demo-action{border:0;background:#0766f8;color:#fff;border-radius:6px;padding:9px 13px;font-size:11px;font-weight:600}.demo-form button{justify-self:start}.demo-action.secondary{background:#eef3fa;color:#46617d}.demo-action.danger{background:#fff1ef;color:#bd5e51}.demo-actions{display:flex;gap:7px;flex-wrap:wrap}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:11px;text-align:left;white-space:nowrap}th{font-size:9px;letter-spacing:.6px;text-transform:uppercase;color:#91a0b1;font-weight:500;padding:13px 10px;background:#f8fafe}td{padding:14px 10px;border-top:1px solid #edf1f7}td:first-child{font-weight:600;color:#294561}.pill{display:inline-block;padding:4px 8px;border-radius:5px;font-size:9px;background:#edf4ff;color:#4c7bb8}.pill.approved,.pill.complete,.pill.published,.pill.delivered,.pill.confirmed{background:#e9f8f0;color:#2b8f65}.pill.declined{background:#fff0ed;color:#ba6b5d}.pill.pending,.pill.review,.pill.queued{background:#fff6df;color:#b18432}.task{padding:16px 0;border-top:1px solid #edf1f6;display:flex;justify-content:space-between;gap:16px;align-items:start}.task:first-of-type{border-top:0}.task h3{font-size:13px;margin:0 0 6px;letter-spacing:-.01em}.task p{font-size:11px;margin:0 0 9px}.task small{display:block;font-size:10px;color:#8d9aac}.empty-demo{padding:20px;background:#f7faff;color:#7a90a9;border-radius:8px;font-size:12px}.demo-note-inline{color:#8395a9;font-size:10px;margin-top:15px}.demo-filter{max-width:300px;margin-bottom:15px}.demo-toast-visible{padding:12px 16px;border:1px solid #bbdfce;border-radius:8px;background:#edf9f3;color:#337456;font-size:12px;margin-bottom:20px}.demo-chart{display:flex;align-items:end;gap:22px;height:160px;padding:20px 10px 0;border-bottom:1px solid #dae4ef;margin-bottom:24px}.demo-chart>div{flex:1;height:var(--h);background:linear-gradient(#287efa,#b6d6ff);border-radius:5px 5px 0 0;min-height:5px;position:relative}.demo-chart span{position:absolute;bottom:-21px;width:100%;text-align:center;white-space:nowrap;font-size:9px;color:#7e91a9}.progress-track{display:flex;gap:6px;margin:20px 0}.progress-track span{height:7px;background:#e5edf5;border-radius:8px;flex:1}.progress-track .done{background:#2d84fa}.big-reference{font-size:27px;font-weight:700;letter-spacing:-1px}.story-preview{border-left:3px solid #0766f8;padding:15px 20px;background:#f7faff;white-space:pre-wrap}.story-preview h3{font-size:22px}.story-preview p{font-size:13px;color:#52687e;line-height:1.7}.demo-mobile-card{max-width:410px;margin:0 auto}.driver-check label{display:flex;align-items:center;gap:12px;font-size:12px;padding:10px 0}.driver-check input{width:auto}.driver-check{margin-bottom:15px}.driver-check input[type=number]{width:85px;display:inline-block}.job-route{display:flex;align-items:center;gap:16px;background:#f5f9ff;padding:18px;border-radius:8px;margin:15px 0;font-size:12px}.job-route strong{color:#0766f8;font-size:20px}.role-hint{padding:12px 16px;background:#edf4ff;color:#547392;font-size:11px;border-radius:7px;margin-bottom:20px}
@media(max-width:850px){.demo-shell{grid-template-columns:150px 1fr}.demo-sidebar{padding:22px 12px}.demo-main{padding:22px}.demo-columns{grid-template-columns:1fr}.stats{gap:10px}.stat{padding:14px}.stat b{font-size:23px}.demo-card{padding:18px}}
@media(max-width:550px){.demo-banner{padding:10px 12px;font-size:7px}.demo-shell{display:block}.demo-sidebar{padding:15px;border-right:0;border-bottom:1px solid #dce6f2;display:block}.demo-brand{display:none}.demo-sidebar>strong{display:block;margin-bottom:12px;font-size:13px}.demo-sidebar [role=tablist]{display:flex;flex-wrap:wrap;gap:5px}.demo-sidebar [role=tab]{font-size:10px;padding:8px 9px;background:#f5f8fc}.sidebar-help{display:none}.demo-main{padding:20px 14px}.demo-heading h1{font-size:24px}.demo-heading{margin-bottom:20px}.stats{gap:8px}.stat{padding:12px 9px}.stat small{font-size:9px}.stat b{font-size:20px}.stat span{font-size:8px}.demo-card{padding:17px}.task{flex-direction:column;gap:8px}.demo-columns{gap:0}.demo-chart{gap:10px}.job-route{font-size:10px}.demo-reset{font-size:10px;padding:6px 8px}}

.demo-back{display:inline-flex;align-items:center;flex-shrink:0;padding:7px 11px;border:1px solid #bad2ee;border-radius:6px;background:#fff;color:#315c8e;font-size:11px;font-weight:600;text-decoration:none;letter-spacing:0}.demo-back:hover{background:#f4f8ff}.demo-back:focus-visible{outline:2px solid #0766f8;outline-offset:3px}.demo-banner{flex-wrap:wrap}