/* Preview scene controls use workspace chrome; the demo uses only theme roles. */
.preview-controls{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.preview-scenes button[aria-selected=true]{background:#f8faf6;box-shadow:0 1px 3px #0002}
.design-grid.is-dashboard{grid-template-columns:minmax(0,1fr)}.design-grid.is-dashboard #role-editors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 24px}
.dashboard-preview{background:var(--dash-background);color:var(--dash-text);font-size:14px;line-height:1.5}.dashboard-preview[hidden],.ui-preview[hidden],#dashboard-provenance[hidden]{display:none}
.dash-layout{display:grid;grid-template-columns:170px minmax(0,1fr);min-height:680px}.dash-sidebar{background:var(--dash-surface);color:var(--dash-on-surface);border-right:1px solid var(--dash-border);padding:24px 14px;display:flex;flex-direction:column;gap:32px}.dash-brand{display:flex;align-items:center;gap:10px;font-size:19px}.dash-brand>span{display:grid;place-items:center;width:28px;height:28px;background:var(--dash-primary);color:var(--dash-on-primary);border-radius:8px;font-size:16px}.dash-sidebar nav{display:grid;gap:8px}.dash-sidebar button{text-align:left;padding:10px;border-radius:6px;color:inherit;font-size:inherit;min-height:40px}.dash-sidebar button:hover,.dash-sidebar button[aria-pressed=true]{background:var(--dash-primary-selected);color:var(--dash-on-primary-selected)}.dash-sidebar>p{margin-top:auto;font-size:12px}
.dash-main{min-width:0;padding:28px}.dash-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:28px}.dashboard-preview p{margin:0}.dash-heading p{font-size:12px;margin-bottom:9px}.dash-heading h3{font-size:clamp(22px,2.4vw,30px);line-height:1.2;font-weight:500;letter-spacing:-.7px;margin:0}.dashboard-preview h4{font-size:14px;font-weight:500;margin:0}.dashboard-preview button{font-family:inherit;white-space:normal}.dash-primary{background:var(--dash-primary);color:var(--dash-on-primary);padding:10px 14px;min-height:40px;border-radius:7px;font-size:13px;display:flex;align-items:center;gap:16px}.dash-primary:hover{background:var(--dash-primary-hover);color:var(--dash-on-primary-hover)}.dash-primary:active{background:var(--dash-primary-pressed);color:var(--dash-on-primary-pressed)}.dash-primary:disabled{background:var(--dash-disabled);color:var(--dash-on-disabled);cursor:default}
.dashboard-preview :is(button,input,select,[tabindex]):focus-visible{outline:2px solid var(--dash-focus);outline-offset:3px}.dash-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:20px}.dash-metrics article{padding:20px;background:var(--dash-surface);color:var(--dash-on-surface);border:1px solid var(--dash-border);border-radius:10px}.dash-metrics strong{display:block;font-size:34px;font-weight:500;letter-spacing:-1px;font-variant-numeric:tabular-nums;margin:12px 0 4px}.dash-metrics p{font-size:12px}
.dash-chart-panel,.dash-projects{background:var(--dash-surface);color:var(--dash-on-surface);border:1px solid var(--dash-border);border-radius:10px;padding:20px;margin-bottom:20px}.dash-panel-heading{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:18px}.dash-panel-heading p,.dash-panel-heading>span{font-size:12px}.dashboard-preview label{display:grid;gap:5px;font-size:12px;min-width:0}.dashboard-preview input,.dashboard-preview select{background:var(--dash-surface);color:var(--dash-on-surface);border:1px solid var(--dash-border);border-radius:6px;padding:8px 10px;font:inherit;min-height:38px;min-width:0;max-width:100%}.dashboard-preview input::placeholder{color:var(--dash-on-surface);opacity:1}.dash-chart{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;font-size:12px;font-variant-numeric:tabular-nums}.dash-chart-column{display:grid;gap:6px;text-align:center;min-width:0}.dash-bar-track{height:100px;display:flex;align-items:flex-end;justify-content:center;border-bottom:1px solid var(--dash-border)}.dash-bar{display:block;background:var(--dash-primary);width:min(100%,48px);border-radius:4px 4px 0 0}
.dash-filters{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:16px}.dash-filters label:first-child{flex:1 1 200px}.dash-filters label:last-child{flex:0 1 160px}.dash-table-scroll{max-width:100%;overflow:auto}.dash-projects table{width:100%;border-collapse:collapse;text-align:left;font-size:13px}.dash-projects :is(th,td){padding:12px 10px;border-bottom:1px solid var(--dash-border);white-space:nowrap}.dash-projects th{font-weight:500}.dash-projects thead th{font-size:12px}.dash-projects td:last-child{text-align:right;font-variant-numeric:tabular-nums}.dash-status{display:inline-block;font-size:11px;padding:3px 8px;border-radius:5px}.dash-status[data-status="In progress"]{background:var(--dash-info);color:var(--dash-on-info)}.dash-status[data-status="Review"]{background:var(--dash-warning);color:var(--dash-on-warning)}.dash-status[data-status="Complete"]{background:var(--dash-success);color:var(--dash-on-success)}#dash-empty{padding:16px 0}.dash-feedback{font-size:12px}
#dashboard-provenance{padding:14px 20px;font-size:12px;color:#34422d;background:#f3f5ef;border-top:1px solid #d5dacf}#dashboard-provenance p{margin:0 0 8px;line-height:1.5}#dashboard-provenance summary{cursor:pointer}#dashboard-sources{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 20px;margin-bottom:0}#dashboard-sources div{min-width:0;overflow-wrap:anywhere}#dashboard-sources dt{font-weight:500}#dashboard-sources dd{margin:0}
@media(max-width:800px){.design-section>.section-heading{flex-wrap:wrap}.dash-layout{grid-template-columns:minmax(0,1fr)}.dash-sidebar{border-right:0;border-bottom:1px solid var(--dash-border);padding:14px 20px;flex-direction:row;align-items:center;flex-wrap:wrap;gap:12px 24px}.dash-sidebar nav{display:flex;gap:6px;flex-wrap:wrap}.dash-sidebar>p{margin:0 0 0 auto}.dash-main{padding:20px}.dash-metrics{gap:10px}.dash-metrics article{padding:14px}.dash-metrics strong{font-size:28px}}
@media(max-width:500px){.preview-controls{gap:8px}.preview-controls .segmented button{padding:7px 10px}.dash-main{padding:16px}.dash-heading{margin-bottom:20px}.dash-metrics{grid-template-columns:minmax(0,1fr)}.dash-metrics article{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2px 12px}.dash-metrics strong{grid-column:2;grid-row:1/3;margin:0}.dash-metrics p{grid-column:1}.dash-chart-panel,.dash-projects{padding:14px}.dash-chart{gap:8px}.dash-sidebar>p{margin:0}.design-grid.is-dashboard #role-editors,#dashboard-sources{grid-template-columns:minmax(0,1fr)}}
.preview-controls{min-width:0;max-width:100%}.preview-controls .segmented{min-width:0;max-width:100%;flex-shrink:1}.preview-scenes button{min-width:0;white-space:normal;overflow-wrap:anywhere}
/* Give WebKit selects the same usable control size as the other browsers. */
.dashboard-preview select{appearance:none;padding-right:30px}.dashboard-preview label:has(select){position:relative}.dashboard-preview label:has(select)::after{content:'⌄';position:absolute;right:10px;bottom:8px;color:var(--dash-on-surface);pointer-events:none}

.dashboard-review{margin-top:16px;border-top:1px solid #d5dacf;padding-top:14px}.dashboard-review>label{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:12px 0}.dashboard-review select{font:inherit;appearance:none;min-height:38px;padding:8px 28px 8px 10px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath d='m3 4.5 3 3 3-3' fill='none' stroke='%2334422d'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;border:1px solid #a8b2a0;border-radius:6px;background-color:#fff;color:#25301f}.dashboard-review>p{max-width:80ch}.dashboard-check{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;padding:12px 0;border-top:1px solid #d5dacf}.dashboard-check .text-button{font-size:12px;text-align:left;white-space:normal;overflow-wrap:anywhere}.dashboard-check p{grid-column:1/-1}.dashboard-check[data-status=fail]>span{color:#9a2929}.dashboard-check[data-status=unchecked]>span{color:#665121}.dashboard-check:focus-within{outline:2px solid #3e7130;outline-offset:4px}@media(max-width:800px){.dashboard-check{grid-template-columns:minmax(0,1fr)}}