.experience-panel{padding:clamp(20px,4vw,48px);border:1px solid var(--dna-interface-line,#bacbbb);border-radius:14px;margin-block:30px 70px;background:var(--dna-interface-bg,#fff);color:var(--dna-interface-ink,#152c25)}.experience-panel label{display:grid;gap:8px;font-weight:650}.experience-panel input,.experience-panel select{font:inherit;min-height:44px;padding:8px 12px;color:inherit;background:var(--dna-interface-soft,#f5f7f2);border:1px solid currentColor;border-radius:5px;max-width:100%}.experience-controls{display:flex;gap:18px;flex-wrap:wrap;align-items:end;margin-block:24px}.experience-controls label{flex:1;min-width:min(210px,100%)}#chooser-result{overflow-wrap:anywhere}#chooser-result code{display:block;font-size:.8em;margin-block:12px}#chooser-result .button{margin-block:12px}.demo-boundary{border-inline-start:4px solid currentColor;padding-inline-start:15px;font-weight:650}.experience-summary{display:flex;gap:24px;flex-wrap:wrap;font-weight:650}.experience-layout{height:220px;position:relative;margin-block:24px;border:1px dashed currentColor}.experience-monitor{position:absolute;display:grid;place-items:center;overflow:hidden;overflow-wrap:anywhere;text-align:center;padding:8px;border:3px solid var(--dna-interface-bg,#fff);outline:1px solid currentColor;background:var(--dna-interface-soft,#f5f7f2);font-size:.85em}.experience-table{overflow:auto;max-width:100%}.experience-table table{width:100%;border-collapse:collapse;text-align:start}.experience-table td,.experience-table th{padding:12px;border-block-end:1px solid var(--dna-interface-line,#bacbbb)}.help-results{display:grid;gap:24px;margin-block:24px}.help-results article{border-block-end:1px solid var(--dna-interface-line,#bacbbb);padding-block-end:18px}.help-results h2{font-size:1.4em}#help-search{width:100%}@media(max-width:600px){.experience-controls{align-items:stretch;flex-direction:column}.experience-layout{height:180px}.experience-monitor{font-size:.65em;padding:4px}}@media(forced-colors:active){.experience-monitor{outline:1px solid CanvasText;background:Canvas;color:CanvasText}}
/* Keep primary foreground/background paired across every user palette. */
body[data-dna-surface="website"] .button:not(.secondary):not(.lime){background:var(--dna-interface-accent);border-color:var(--dna-interface-accent);color:var(--dna-interface-on-accent)}
body[data-dna-surface="website"] .button:not(.secondary):not(.lime):hover{background:var(--dna-interface-accent);color:var(--dna-interface-on-accent);text-decoration:underline}
body[data-dna-surface="website"] nav a.button{color:var(--dna-interface-on-accent)}
/* Palette changes keep paired foreground/background colors in the same frame. */
body[data-dna-surface="website"] .button:not(.secondary):not(.lime){transition:transform .15s}
html[data-dna-contrast="high"] body[data-dna-surface="website"] .button{transition:none}