:root{--color-primary-start: hsl(261, 80%, 55%);--color-primary-end: hsl(220, 80%, 55%);--color-text: hsl(220, 15%, 20%);--color-text-light: hsl(220, 10%, 60%);--color-bg: hsl(220, 15%, 97%);--color-card: hsl(0, 0%, 100%);--color-border: hsl(220, 15%, 90%);--color-shadow: hsla(220, 15%, 20%, .1);--radius-md: .75rem;--radius-lg: 1rem}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:system-ui,-apple-system,sans-serif;color:var(--color-text);background-color:var(--color-bg);line-height:1.6;min-height:100dvh;display:flex;flex-direction:column}header{padding:1.5rem 1rem;text-align:center;background:linear-gradient(90deg,var(--color-primary-start),var(--color-primary-end));color:#fff;box-shadow:0 4px 12px var(--color-shadow)}h1{font-size:2.5rem;margin-bottom:.25rem}.subtitle{font-size:1.1rem;color:#ffffffd9;margin:0}.hidden{display:none}main.main-container{flex:1;display:flex;flex-wrap:wrap;gap:2rem;max-width:1200px;margin:2rem auto;padding:1rem;width:100%}.left-col,.right-col{flex:1 1 350px;min-width:320px;display:flex;flex-direction:column}.left-col,.right-col{background:var(--color-card);padding:2rem 1.5rem;border-radius:var(--radius-lg);box-shadow:0 4px 16px var(--color-shadow);border:1px solid var(--color-border)}form#preference-form{display:flex;flex-direction:column;gap:1.25rem}form#preference-form label{font-weight:600;margin-bottom:.5rem;display:block}form#preference-form select,form#preference-form button{width:100%;font-size:1rem;padding:.75rem;border-radius:var(--radius-md);border:1px solid var(--color-border);background-color:var(--color-bg);transition:border-color .2s,box-shadow .2s}form#preference-form select:focus,form#preference-form button:focus{outline:none;border-color:var(--color-primary-end);box-shadow:0 0 0 3px #306ee833}form#preference-form button{background:linear-gradient(90deg,var(--color-primary-start),var(--color-primary-end));color:#fff;border:none;font-weight:700;cursor:pointer;transition:transform .2s,box-shadow .2s}form#preference-form button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #306ee84d}.results-list{display:flex;flex-direction:column;gap:1.5rem}.workout-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:1.5rem;transition:transform .2s,box-shadow .2s}.workout-card:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 6px 16px var(--color-shadow)}.workout-card h3{color:var(--color-primary-start);margin-bottom:.75rem;font-size:1.25rem}.workout-card p{margin-bottom:.25rem;color:var(--color-text-light)}.workout-card strong{color:var(--color-text)}@media(max-width:800px){main.main-container{flex-direction:column;gap:1.5rem}}.highlight-experiment{box-shadow:0 0 0 2px purple;border:5px solid transparent;padding:1rem}.experiment-border{border:2px dashed var(--color-accent)}.card-badge{background-color:var(--color-accent);color:var(--color-bg);padding:.25rem .5rem;border-radius:4px;font-size:.8rem;font-weight:700;position:absolute;top:.5rem;right:.5rem}.workout-card{position:relative;border:1px solid var(--color-muted);padding:1rem;margin-bottom:1rem;border-radius:8px}.back-button{background:#fff;color:var(--color-primary-start);border:none;padding:var(--spacing-sm) var(--spacing-lg);border-radius:var(--radius-sm);font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 2px 4px var(--color-shadow)}.workout-image{width:100%;height:auto;border-radius:var(--radius-md);margin-bottom:1rem}