.demo-hint{color:var(--muted);font-size:.85rem;max-width:60ch;margin:-1.5rem 0 2rem;}.demo-widget{display:grid;gap:1.25rem;margin-bottom:2.5rem;}.demo-palette{display:flex;flex-wrap:wrap;gap:.85rem;list-style:none;margin:0;padding:0;}.demo-card{display:inline-flex;align-items:center;gap:.6rem;padding:.75rem 1.1rem;background:var(--surface);border:1px solid var(--border);color:var(--white);font:inherit;font-size:.9rem;font-weight:500;cursor:grab;touch-action:none;-webkit-user-drag:element;user-select:none;-webkit-user-select:none;transition:border-color .2s,opacity .2s;}.demo-card .icon{width:18px;height:18px;flex:0 0 18px;color:var(--aqua);}.demo-card:hover,.demo-card:focus-visible{border-color:var(--aqua);}.demo-card:active{cursor:grabbing;}.demo-card.is-dragging{cursor:grabbing;opacity:.5;border-color:var(--aqua);}.demo-canvas{min-height:110px;border:1px dashed var(--border);padding:1.25rem;display:flex;flex-wrap:wrap;align-content:flex-start;align-items:center;gap:.6rem;transition:border-color .2s,background-color .2s;}.demo-canvas.drag-active{border-style:solid;border-color:var(--aqua);background:color-mix(in srgb,var(--aqua) 8%,transparent);}.demo-canvas-empty{grid-column:1 / -1;margin:auto;color:var(--muted);font-size:.9rem;text-align:center;}.demo-canvas-empty[hidden]{display:none;}.demo-chip{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem .5rem .4rem .85rem;background:var(--black);border:1px solid var(--aqua);color:var(--white);font-size:.8rem;animation:demo-item-enter .3s cubic-bezier(.16,1,.3,1);}.demo-chip-remove{width:18px;height:18px;display:grid;place-items:center;background:transparent;border:0;color:var(--muted);font-size:.85rem;line-height:1;cursor:pointer;}.demo-chip-remove:hover,.demo-chip-remove:focus-visible{color:var(--error);}.demo-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;}.demo-count{margin:0;font-size:.9rem;}.demo-count strong{font-family:var(--font-mono);color:var(--aqua);font-size:1.1rem;}.demo-reset{background:transparent;border:1px solid var(--border);color:var(--white);font-weight:600;font-size:.85rem;padding:.6rem 1.1rem;cursor:pointer;}.demo-reset:hover,.demo-reset:focus-visible{border-color:var(--aqua);color:var(--aqua);}.demo-result{border:1px solid var(--border);background:var(--surface);--demo-tone-actual:var(--aqua);--demo-tone-white:var(--white);--demo-tone-target:var(--wine);}.demo-browser-bar{display:flex;align-items:center;gap:.6rem;padding:.75rem 1rem;border-bottom:1px solid var(--border);}.demo-live-dot{width:8px;height:8px;flex:0 0 8px;background:var(--aqua);border-radius:50%;animation:demo-live-pulse 2s ease-in-out infinite;}@keyframes demo-live-pulse{0%,100%{opacity:1;}50%{opacity:.35;}}@media (prefers-reduced-motion:reduce){.demo-live-dot{animation:none;}}.demo-browser-path{font-family:var(--font-mono);font-size:.78rem;color:var(--muted);}.demo-dashboard-grid{min-height:180px;padding:1.5rem;display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;align-content:start;}@media (min-width:700px){.demo-dashboard-grid{grid-template-columns:repeat(4,1fr);}}.demo-item{border:1px solid var(--border);background:var(--black);padding:1rem;animation:demo-item-enter .35s cubic-bezier(.16,1,.3,1);}@keyframes demo-item-enter{from{opacity:0;transform:scale(.92);}to{opacity:1;transform:scale(1);}}@media (prefers-reduced-motion:reduce){.demo-item,.demo-chip{animation:none;}}.demo-kpi-label{display:block;color:var(--muted);font-size:.78rem;}.demo-kpi-value{display:block;font-family:var(--font-display);font-weight:800;font-size:1.7rem;color:var(--white);letter-spacing:-.01em;margin-top:.3rem;}.demo-kpi-trend{margin:.5rem 0 0;font-family:var(--font-mono);font-size:.75rem;color:var(--aqua);}.demo-kpi-arrow{display:inline-block;}.demo-kpi-trend-caption{color:var(--muted);}.demo-item--chart{grid-column:span 2;}.demo-chart-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:.5rem;margin-bottom:.85rem;}.demo-chart-title{font-weight:600;font-size:.85rem;}.demo-chart-legend{display:inline-flex;align-items:center;gap:.3rem;color:var(--muted);font-size:.72rem;}.demo-legend-dot{width:8px;height:8px;display:inline-block;margin-left:.5rem;}.demo-legend-dot:first-child{margin-left:0;}.demo-legend-dot--actual{background:var(--aqua);}.demo-legend-dot--target{background:var(--wine);}.demo-legend-dot--white{background:var(--white);}.demo-bars{display:flex;align-items:flex-end;gap:.6rem;height:84px;}.demo-bar-group{flex:1;display:flex;flex-direction:column;align-items:center;gap:.4rem;height:100%;}.demo-bar-track{flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center;gap:2px;}.demo-bar{display:block;width:40%;font-style:normal;}.demo-bar--actual{background:var(--aqua);}.demo-bar--target{background:var(--wine);}.demo-bar-label{font-family:var(--font-mono);font-size:.68rem;color:var(--muted);}.demo-progress-row{display:flex;align-items:center;gap:.6rem;margin:.6rem 0 .5rem;}.demo-progress-track{flex:1;height:8px;background:var(--border);}.demo-progress-fill{height:100%;background:var(--aqua);}.demo-progress-percent{font-family:var(--font-mono);font-size:.8rem;color:var(--aqua);}.demo-progress-caption{margin:0;color:var(--muted);font-size:.75rem;}.demo-donut-title{font-weight:600;font-size:.85rem;margin:0 0 .85rem;}.demo-donut-body{display:flex;align-items:center;gap:1rem;}.demo-donut-ring{width:72px;height:72px;flex:0 0 72px;border-radius:50%;}.demo-donut-legend{list-style:none;margin:0;padding:0;display:grid;gap:.4rem;font-size:.75rem;color:var(--muted);}.demo-donut-legend li{display:flex;align-items:center;gap:.5rem;}.demo-item--table{grid-column:span 2;}.demo-table-title{font-weight:600;font-size:.85rem;margin:0 0 .85rem;}.demo-table{width:100%;border-collapse:collapse;font-size:.78rem;}.demo-table th{text-align:left;color:var(--muted);font-weight:500;padding-bottom:.5rem;border-bottom:1px solid var(--border);}.demo-table th:last-child{text-align:right;}.demo-table td{padding:.5rem 0;border-bottom:1px solid var(--border);}.demo-table tr:last-child td{border-bottom:0;}.demo-table-amount{font-family:var(--font-mono);text-align:right;color:var(--aqua);}.demo-upsell-title{font-weight:600;font-size:.95rem;margin:0 0 .35rem;}.demo-upsell-body{color:var(--muted);font-size:.8rem;margin:0 0 .85rem;}.demo-fake-button{display:block;text-align:center;background:var(--aqua);color:var(--black);border:1px solid var(--aqua);font-weight:600;font-size:.85rem;padding:.6rem .5rem;}.demo-item--text{grid-column:span 2;}.demo-activity-title{font-weight:600;font-size:.95rem;margin:0 0 .75rem;}.demo-activity-list{list-style:none;margin:0;padding:0;display:grid;gap:.6rem;}.demo-activity-list li{display:flex;align-items:center;gap:.6rem;font-size:.82rem;}.demo-activity-dot{width:6px;height:6px;flex:0 0 6px;background:var(--aqua);border-radius:50%;}.demo-activity-name{flex:1;color:var(--white);}.demo-activity-time{font-family:var(--font-mono);font-size:.72rem;color:var(--muted);}