.demo-page{min-height:100vh;padding-bottom:var(--spacing-16)}.demo-page__title{font-size:var(--font-sizes-4xl);font-weight:var(--font-weights-semibold);letter-spacing:var(--letter-spacings-tight);margin-top:var(--spacing-8)}.demo-page__step-heading{font-size:var(--font-sizes-2xl);font-weight:var(--font-weights-medium);margin-top:var(--spacing-4);outline:none}.privacy-panel{background:var(--colors-bg-subtle);border:1px solid var(--colors-border-subtle);border-radius:var(--radii-md);margin-top:var(--spacing-6);padding:var(--spacing-4)}.privacy-panel h3{font-size:var(--font-sizes-sm);font-weight:var(--font-weights-semibold);margin-bottom:var(--spacing-2)}.privacy-panel p{color:var(--colors-fg-muted);font-size:var(--font-sizes-sm);line-height:var(--line-heights-normal);margin:0}.privacy-panel__note{color:var(--colors-fg);margin-top:var(--spacing-2)}.demo-step{margin-top:var(--spacing-8)}.dropzone{align-items:center;border:2px dashed var(--colors-border);border-radius:var(--radii-lg);display:flex;flex-direction:column;gap:var(--spacing-4);justify-content:center;min-height:12rem;padding:var(--spacing-8);text-align:center}.dropzone:focus-visible{border-color:var(--colors-accent);outline:2px solid var(--colors-accent);outline-offset:2px}.demo-or{color:var(--colors-fg-muted);margin:var(--spacing-4) 0;text-align:center}.demo-note{color:var(--colors-fg-muted);font-size:var(--font-sizes-sm);margin-top:var(--spacing-4)}.demo-error{background:var(--colors-danger-subtle, #fff0f0);border:1px solid var(--colors-danger, #c00);border-radius:var(--radii-md);color:var(--colors-danger, #900);padding:var(--spacing-4)}.demo-meta{align-items:center;display:flex;gap:var(--spacing-3);margin-bottom:var(--spacing-4)}.demo-table-scroll{border:1px solid var(--colors-border-subtle);border-radius:var(--radii-md);overflow-x:auto}.demo-table{border-collapse:collapse;font-size:var(--font-sizes-sm);min-width:100%;text-align:left;width:max-content}.demo-table th,.demo-table td{border-bottom:1px solid var(--colors-border-subtle);padding:var(--spacing-3) var(--spacing-4);vertical-align:top;white-space:nowrap}.demo-table th{background:var(--colors-bg-subtle);font-weight:var(--font-weights-medium)}.demo-col{align-items:center;display:flex;gap:var(--spacing-2)}.demo-col__name{font-family:monospace}.demo-col__reason{color:var(--colors-fg-muted);font-size:var(--font-sizes-xs);line-height:var(--line-heights-snug);margin:var(--spacing-1) 0 0;max-width:16rem;white-space:normal}.demo-cell--empty{color:var(--colors-fg-muted)}.demo-cell--hash{font-family:monospace}.demo-decisions{display:grid;gap:var(--spacing-4);grid-template-columns:repeat(auto-fill,minmax(18rem,1fr));margin-top:var(--spacing-8)}.demo-decision{border:1px solid var(--colors-border-subtle);border-radius:var(--radii-md);padding:var(--spacing-4)}.demo-decision__label{display:block;font-size:var(--font-sizes-sm);font-weight:var(--font-weights-medium);margin-bottom:var(--spacing-2)}.demo-decision__label .mono{font-family:monospace}.demo-radio-group{display:flex;flex-wrap:wrap;gap:var(--spacing-3)}.demo-radio-label{align-items:center;cursor:pointer;display:inline-flex;gap:var(--spacing-2);font-size:var(--font-sizes-sm)}.demo-radio-label input{accent-color:var(--colors-accent);cursor:pointer;height:1.25rem;width:1.25rem}.demo-radio-label input:disabled{cursor:default}.demo-radio-label input:focus-visible{outline:2px solid var(--colors-accent);outline-offset:2px}.demo-decision__reason{color:var(--colors-fg-muted);font-size:var(--font-sizes-xs);line-height:var(--line-heights-snug);margin:var(--spacing-2) 0 0}.demo-decision__locked{color:var(--colors-warning, #b45a00);font-size:var(--font-sizes-xs);margin:var(--spacing-2) 0 0}.demo-lockbar{align-items:center;border-top:1px solid var(--colors-border-subtle);display:flex;gap:var(--spacing-3);margin-top:var(--spacing-8);padding-top:var(--spacing-4)}.demo-lockbar p{color:var(--colors-fg-muted);font-size:var(--font-sizes-sm);margin:0}.demo-lockbar .lock{flex:none;height:2.5rem;width:2.5rem}.demo-actions{align-items:center;display:flex;gap:var(--spacing-3);margin-top:var(--spacing-8)}.demo-ready{color:var(--colors-success, #006600);margin-top:var(--spacing-4)}.demo-section-heading{font-size:var(--font-sizes-lg);font-weight:var(--font-weights-medium);margin-bottom:var(--spacing-4);margin-top:var(--spacing-8)}.demo-labels{display:grid;gap:var(--spacing-3);grid-template-columns:repeat(auto-fill,minmax(14rem,1fr));margin-top:var(--spacing-4)}.demo-label{border:1px solid var(--colors-border-subtle);border-radius:var(--radii-md);padding:var(--spacing-3)}.demo-label__name{font-family:monospace;font-size:var(--font-sizes-xs);margin:0}.demo-label__value{color:var(--colors-fg-muted);font-size:var(--font-sizes-sm);margin:var(--spacing-1) 0 0}.demo-question{margin-top:var(--spacing-6)}.demo-question__label{display:block;font-size:var(--font-sizes-sm);font-weight:var(--font-weights-medium);margin-bottom:var(--spacing-2)}.demo-question__input{background:var(--colors-bg);border:1px solid var(--colors-border);border-radius:var(--radii-md);color:var(--colors-fg);font:inherit;padding:var(--spacing-2) var(--spacing-3);width:100%}.demo-question__input:focus-visible{border-color:var(--colors-accent);outline:2px solid var(--colors-accent);outline-offset:2px}.demo-question__error{color:var(--colors-danger, #900);font-size:var(--font-sizes-sm);margin:var(--spacing-2) 0 0}.demo-working{color:var(--colors-fg-muted);margin-top:var(--spacing-4)}.demo-explanation{margin-top:var(--spacing-4)}.demo-how-made{border:1px solid var(--colors-border-subtle);border-radius:var(--radii-md);margin-top:var(--spacing-8);padding:var(--spacing-4)}.demo-how-made summary{cursor:pointer;font-weight:var(--font-weights-medium)}.demo-how-made__body{display:grid;gap:var(--spacing-4);margin-top:var(--spacing-4)}.demo-how-made h4{font-size:var(--font-sizes-sm);font-weight:var(--font-weights-medium);margin:0 0 var(--spacing-2)}.demo-how-made pre{background:var(--colors-bg-subtle);border-radius:var(--radii-sm);font-family:monospace;font-size:var(--font-sizes-xs);overflow-x:auto;padding:var(--spacing-3);white-space:pre-wrap}.demo-how-made ul{font-size:var(--font-sizes-sm);margin:0;padding-left:var(--spacing-5)}.demo-next-question{margin-top:var(--spacing-6)}[x-cloak]{display:none!important}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.answer-chart{margin-top:var(--spacing-6)}.answer-chart__svg{display:block;height:auto;max-width:100%}.answer-chart__axis{stroke:var(--colors-border-emphasized);stroke-width:1}.answer-chart__category,.answer-chart__value{fill:var(--colors-fg)}.answer-chart__hash{font-family:var(--fonts-mono)}.answer-chart__bar{animation:answer-chart-bar-grow .5s var(--easings-out) both;transform-box:fill-box;transform-origin:left}.answer-chart__point{animation:answer-chart-point-fade .4s var(--easings-out) both}@keyframes answer-chart-bar-grow{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes answer-chart-point-fade{0%{opacity:0}to{opacity:1}}.answer-chart__fallback{color:var(--colors-fg-muted);font-size:var(--font-sizes-sm)}@media (prefers-reduced-motion: reduce){.answer-chart__bar,.answer-chart__point{animation:none}}
